快捷導(dǎo)航

徹底搞懂JS無(wú)縫滾動(dòng)代碼

更新時(shí)間：2007年01月03日 00:00:00 作者：

在做個(gè)東西要滾動(dòng)代碼而且是無(wú)縫的搞了半天還是不行
決心一定要把這個(gè)問(wèn)題搞定經(jīng)過(guò)研究也不難代碼如下：

程序代碼

<div id=demo style=overflow:auto;height:180;width:200;background:#009900;color:#006600>  
<table  align=top>  
<tr>  
<td id=demo1 valign=top>  

<p>aaaaaaaaaaa</p>  
<p>aaaaaaaaaaa</p>  
<p>aaaaaaaaaaa</p>  
<p>aaaaaaaaaaa</p>  
<p>aaaaaaaaaaa</p>  
<p>aaaaaaaaaaa</p>  


 </td>  
</tr>  
<tr>  
<td id=demo2 valign=top></td>  
</tr>  
</table>  

</div>  
<script>  
var speed=15  
demo2.innerHTML=demo1.innerHTML//克隆demo1為demo2  
function Marquee(){  
if(demo2.offsetHeight-demo.scrollTop<=0)//當(dāng)滾動(dòng)至demo1與demo2交界時(shí)  
demo.scrollTop-=demo1.offsetHeight//demo跳到最頂端  
else{  
demo.scrollTop++  //如果是橫向的 將 所有的 height top 改成 width left  
}  
}  
var MyMar=setInterval(Marquee,speed)//設(shè)置定時(shí)器  
demo.onmouseover=function() {clearInterval(MyMar)}//鼠標(biāo)移上時(shí)清除定時(shí)器達(dá)到滾動(dòng)停止的目的  
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}//鼠標(biāo)移開(kāi)時(shí)重設(shè)定時(shí)器  
</script> 

復(fù)制到一個(gè)HTM的文件即可運(yùn)行了.

您可能感興趣的文章:

徹底搞懂JS無(wú)縫滾動(dòng)代碼

相關(guān)文章

微信小程序?qū)崿F(xiàn)動(dòng)態(tài)渲染Markdown示例詳解
這篇文章主要為大家介紹了微信小程序?qū)崿F(xiàn)動(dòng)態(tài)渲染Markdown示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪
2023-08-08
js實(shí)現(xiàn)刷新iframe的方法匯總
這里給大家匯總了一些js實(shí)現(xiàn)刷新iframe框架的方法，非常的簡(jiǎn)單實(shí)用，有需要的小伙伴可以參考下。
2015-04-04
這篇文章主要介紹了JS中使用sort結(jié)合localeCompare實(shí)現(xiàn)中文排序?qū)嵗?重點(diǎn)介紹localeCompare函數(shù),需要的朋友可以參考下
2014-07-07

Javascript中瀏覽器窗口的基本操作總結(jié)

BOM全稱是brower object model(瀏覽器對(duì)象模型)，主要用于管理窗口及窗口間的通訊，其核心對(duì)象是window。說(shuō)窗口，可能并不準(zhǔn)確。因?yàn)?，有的瀏覽器窗口可能包含多個(gè)標(biāo)簽頁(yè)，每個(gè)標(biāo)簽頁(yè)都有自己的window對(duì)象。本文將詳細(xì)介紹這些內(nèi)容，有需要可以參考學(xué)習(xí)。

2016-08-08