offsetWidth是指物體可見(jiàn)寬度
scrollLeft是指滾動(dòng)滑塊在滾動(dòng)條上的位置
<!--對(duì)于此例,網(wǎng)頁(yè)中一般會(huì)有三個(gè)容器,此處為demo,demo1和demo2;其中demo1和demo2均在demo中
demo的overflow屬性一般為hidden,我在這里用auto是為了方便你查看scrollLeft的狀態(tài),
另外為方便你理解scrollLeft和offsetWidth,我還在后面加了一個(gè)viewstatus函數(shù),鼠標(biāo)經(jīng)過(guò)容器時(shí)會(huì)看到相關(guān)參數(shù)值
//-->
<div id=demo style="width:200;overflow:auto">
<table><tr>
<td id=demo1>
<img src='a.gif' width=100><img src='b.gif' width=100></td>
<td id=demo2></td>
</tr></table>
</div>
<script>
var speed=30 //定義速度,實(shí)指下面滾動(dòng)函數(shù)的執(zhí)行間隔,值越小滾動(dòng)越快
demo2.innerHTML=demo1.innerHTML //將demo1中的內(nèi)容復(fù)制到demo2
function Marquee(){ //開(kāi)始定義滾動(dòng)函數(shù)
if(demo2.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft-=demo1.offsetWidth //如果滑動(dòng)塊的位置大于demo2的寬度,滑動(dòng)塊退回一個(gè)demo2的寬度
else{
demo.scrollLeft++ //否則,滑動(dòng)塊向右滾動(dòng)(圖片向左滾)
}
}//滾動(dòng)函數(shù)定義完
var MyMar=setInterval(Marquee,speed) //設(shè)置定時(shí)器,使?jié)L動(dòng)函數(shù)每30毫秒運(yùn)行一次
demo.onmouseover=function() {clearInterval(MyMar);viewstatus();}//鼠標(biāo)經(jīng)過(guò)時(shí),清除定時(shí)器,停止執(zhí)行滾動(dòng)函數(shù),彈出信息;
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}// 鼠標(biāo)離開(kāi)后,繼續(xù)滾動(dòng)
function viewstatus(){//這是我加的函數(shù),很簡(jiǎn)單,不注釋了
mess="demo.scrollLeft:"+demo.scrollLeft+"\ndemo1.offsetWidth:"+demo1.offsetWidth+"\ndemo2.offsetWidth:"+demo2.offsetWidth;
alert(mess);
}
</script>