求js一排多张图片向上滚动代码!不是单张的是多张的!

JavaScript016

求js一排多张图片向上滚动代码!不是单张的是多张的!,第1张

假设你要滚动的图片的id是"pic1"-"picn"n>=1

function Slide()

{

for (i=1i<=ni++) //n是图片数

{

idd="pic"+i //生成图片ID

toppx=parseInt(document.getElementById(idd).style.top.replace('px', '')) //获取图片top属性,并去掉属性之后的px,并转换成整型变量

toppx--// top-1

if (toppx==???)//???是一个数字,当图片完全滚出显示范围,就把图片的top变成一个图片群(多行pic)下方的位置,实现循环滚动

{

toppx=???//图片群的下方的位置

}

document.getElementById(idd).style.top=toppx+'px' //新的top值送回图片,实现上滚

}

}

另外记得,这样写,需要把图片的top属性写在html里面,写在css里面是读不到的,但是这样写避免了不同浏览器中获取css中属性的方法不同的问题,有利有弊。

当需要滚动时执行:s=setInterval('Slide()',50)

当需要停止滚动时执行:window.clearInterval(s)

可以根据滚动条y方向的值来设定第一城图片的top值

绑定 onscroll事件 ,当滚动轮滚动的时候去获取滚动轮相对于y方向的值(top值),将第一层的top值设定成和滚动的top值相等就可以了,第一层别忘记加 position:absolute