js實現(xiàn)的類marquee水平循環(huán)滾動
更新時間：2010年03月18日 19:17:23 作者：
marquee （水平）循環(huán)滾動的js實現(xiàn) ,需要的朋友可以參考下。
復(fù)制代碼 代碼如下:
<script>
var speed=20;/*速度數(shù)值越大速度越慢*/
document.getElementById('www_qpsh_com2').innerHTML=document.getElementById('www_qpsh_com1').innerHTML;
/*兩個層來回交替出現(xiàn)*/
function Marquee(){
if(document.getElementById('www_qpsh_com2').offsetWidth-document.getElementById('www_qpsh_com').scrollLeft<=0)
document.getElementById('www_qpsh_com').scrollLeft-=document.getElementById('www_qpsh_com1').offsetWidth;
else{
document.getElementById('www_qpsh_com').scrollLeft++;
}
document.getElementById('my_marquee_info').innerHTML='';
document.getElementById('my_marquee_info').innerHTML+='div.scrollTop:'+document.getElementById('www_qpsh_com').scrollLeft;
}
var MyMar=setInterval(Marquee,speed);
www_qpsh_com.onmouseover=function() {clearInterval(MyMar);}
www_qpsh_com.onmouseout=function() {MyMar=setInterval(Marquee,speed);}
</script>
演示代碼:
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
您可能感興趣的文章:
- JS與HTML結(jié)合使用marquee標簽實現(xiàn)無縫滾動效果代碼
- JQuery插件Marquee.js實現(xiàn)無縫滾動效果
- div+css+js實現(xiàn)無縫滾動類似marquee無縫滾動兼容firefox
- 分別用marquee和div+js實現(xiàn)首尾相連循環(huán)滾動效果，僅3行代碼
- javascript 模擬Marquee文字向左均勻滾動代碼
- Class Of Marquee Scroll通用不間斷滾動JS封裝類
- 用javascript實現(xiàn)代替marquee的滾動字幕效果代碼
- 用javascript代替marquee的滾動字幕效果代碼
- 再次更新！MSClass (Class Of Marquee Scroll通用不間斷滾動JS封裝類 Ver 1.6)
- JS實現(xiàn)無縫循環(huán)marquee滾動效果
相關(guān)文章
通過Jscript中@cc_on 語句識別IE瀏覽器及版本的代碼
通過Jscript中@cc_on 語句識別IE瀏覽器及版本的代碼，需要的朋友可以參考下。2011-05-05
這篇文章主要為大家介紹了JS前端認證授權(quán)技巧歸納總結(jié)，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-03-03
詳解JavaScript數(shù)組和字符串中去除重復(fù)值的方法
這篇文章主要介紹了詳解JavaScript數(shù)組和字符串中去除重復(fù)值的方法,及利用各種限制條件對數(shù)組和字符串進行過濾,需要的朋友可以參考下2016-03-03
詳解微信開發(fā)中snsapi_base和snsapi_userinfo及靜默授權(quán)的實現(xiàn)
這篇文章主要介紹了詳解微信開發(fā)中snsapi_base和snsapi_userinfo及靜默授權(quán)的實現(xiàn)的相關(guān)資料,需要的朋友可以參考下2017-03-03
TypeScript對于Duck類型和模塊命名空間應(yīng)用
這篇文章主要介紹了TypeScript對于Duck類型和模塊命名空間應(yīng)用，Duck類型是一種動態(tài)類型和多態(tài)形式，在duck類型中，重點是對象的行為可以做什么，而不是對象所屬的類型2022-08-08
js-FCC算法-No repeats please字符串的全排列(詳解)
下面小編就為大家?guī)硪黄猨s-FCC算法-No repeats please字符串的全排列(詳解)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-05-05
Javascript實現(xiàn)從小到大的數(shù)組轉(zhuǎn)換成二叉搜索樹
這篇文章主要介紹了Javascript實現(xiàn)從小到大的數(shù)組轉(zhuǎn)換成二叉搜索樹的相關(guān)資料,需要的朋友可以參考下2017-06-06
讓您的菜單不離網(wǎng)站...2006-10-10
這篇文章主要為大家詳細介紹了js實現(xiàn)隨機div顏色位置，類似滿天星效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-10-10
這篇文章主要介紹了JS中循環(huán)字符串拼接時加換行問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-02-02