首先设置元素出状态 top （js 的 clientHeight）
利用 css3 transition，（例：transition: top .2s ease）
然后通过事件改变 top 的值，达到滑动的效果（top: client页面高度 ->top: 0）
（以上仅为参考，该元素需要 position: fixed）
复杂的可以再去上网寻找下各种例子，甚至是尝试模仿一些app的效果自己做点东西出来
state数据2
/5
渲染列表
3
/5
触发向上、向下滚动方法
开始滚动：setInterval() 定时调用滚动方法
停止滚动：clearInterval() 取消定时器
4
/5
向上滚动方法：
1、数组第一条添加到数组末尾 - push()
2、列表向上滚动添加css3过渡动画
3、计算向上滚动距离（第一条数据高度，如果高度固定用固定值即可）
4、删除数组第一条数据 - shift()
5、向上滚动距离清零
6、取消过渡动画停止滚动
5
/5
向下滚动方法：
1、列表向下滚动添加css3过渡动画
2、计算向下滚动距离（最后一条数据高度，如果高度固定用固定值即可）
3、数组最后一条数据添加到数组头部 - unshift()
4、第一条数据添加渐显动画
5、删除数组最后一条数据 - pop()
6、向上滚动距离清零
7、取消过渡动画停止滚动
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159!DOCTYPEhtmlheadmetahttp-equiv="Content-Type"content="text/htmlcharset=gb2312"/title向上下左右不间断无缝滚动效果(兼容火狐和IE)/title/headbodydivid="colee"style="overflow:hiddenheight:253pxwidth:410px"divid="colee1"p此处放文字。。。。。。。。。/pp此处放文字。。。。。。。。。/pp此处放文字。。。。。。。。。/pp此处放文字。。。。。。。。。/pp此处放文字。。。。。。。。。/pp此处放文字。。。。。。。。。/pp此处放文字。。。。。。。。。/pp此处放文字。。。。。。。。。/pp此处放文字。。。。。。。。。/pp此处放文字。。。。。。。。。/pp此处放文字。。。。。。。。。/pp此处放文字。。。。。。。。。/p/divdivid="colee2"/div/divscriptvarspeed=30varcolee2=document.getElementById("colee2")varcolee1=document.getElementById("colee1")varcolee=document.getElementById("colee")colee2.innerHTML=colee1.innerHTML//克隆colee1为colee2functionMarquee1(){//当滚动至colee1与colee2交界时if(colee2.offsetTop-colee.scrollTop=0){colee.scrollTop-=colee1.offsetHeight//colee跳到最顶端}else{colee.scrollTop++}}varMyMar1=setInterval(Marquee1,speed)//设置定时器//鼠标移上时清除定时器达到滚动停止的目的colee.onmouseover=function(){clearInterval(MyMar1)}//鼠标移开时重设定时器colee.onmouseout=function(){MyMar1=setInterval(Marquee1,speed)}/script!--向上滚动代码结束--!--下面是向下滚动代码--divid="colee_bottom"style="overflow:hiddenheight:253pxwidth:410px"divid="colee_bottom1"pimgsrc="/jscss/demoimg/200907/bg3.jpg"/ppimgsrc="/jscss/demoimg/200907/bg3.jpg"/ppimgsrc="/jscss/demoimg/200907/bg3.jpg"/ppimgsrc="/jscss/demoimg/200907/bg3.jpg"/ppimgsrc="/jscss/demoimg/200907/bg3.jpg"/ppimgsrc="/jscss/demoimg/200907/bg3.jpg"/ppimgsrc="/jscss/demoimg/200907/bg3.jpg"/ppimgsrc="/jscss/demoimg/200907/bg3.jpg"/ppimgsrc="/jscss/demoimg/200907/bg3.jpg"/p/divdivid="colee_bottom2"/div/divscriptvarspeed=30varcolee_bottom2=document.getElementById("colee_bottom2")varcolee_bottom1=document.getElementById("colee_bottom1")varcolee_bottom=document.getElementById("colee_bottom")colee_bottom2.innerHTML=colee_bottom1.innerHTMLcolee_bottom.scrollTop=colee_bottom.scrollHeightfunctionMarquee2(){if(colee_bottom1.offsetTop-colee_bottom.scrollTop=0)colee_bottom.scrollTop+=colee_bottom2.offsetHeightelse{colee_bottom.scrollTop--}}varMyMar2=setInterval(Marquee2,speed)colee_bottom.onmouseover=function(){clearInterval(MyMar2)}colee_bottom.onmouseout=function(){MyMar2=setInterval(Marquee2,speed)}/script!--向下滚动代码结束--!--下面是向左滚动代码--divid="colee_left"style="overflow:hiddenwidth:500px"tablecellpadding="0"cellspacing="0"border="0"trtdid="colee_left1"valign="top"align="center"tablecellpadding="2"cellspacing="0"border="0"tralign="center"tdpimgsrc="/jscss/demoimg/200907/bg3.jpg"/p/tdtdpimgsrc="/jscss/demoimg/200907/bg3.jpg"/p/tdtdpimgsrc="/jscss/demoimg/200907/bg3.jpg"/p/tdtdpimgsrc="/jscss/demoimg/200907/bg3.jpg"/p/tdtdpimgsrc="/jscss/demoimg/200907/bg3.jpg"/p/tdtdpimgsrc="/jscss/demoimg/200907/bg3.jpg"/p/tdtdpimgsrc="/jscss/demoimg/200907/bg3.jpg"/p/td/tr/table/tdtdid="colee_left2"valign="top"/td/tr/table/divscript//使用div时，请保证colee_left2与colee_left1是在同一行上.varspeed=30//速度数值越大速度越慢varcolee_left2=document.getElementById("colee_left2")varcolee_left1=document.getElementById("colee_left1")varcolee_left=document.getElementById("colee_left")colee_left2.innerHTML=colee_left1.innerHTMLfunctionMarquee3(){if(colee_left2.offsetWidth-colee_left.scrollLeft=0)//offsetWidth是对象的可见宽度colee_left.scrollLeft-=colee_left1.offsetWidth//scrollWidth是对象的实际内容的宽，不包边线宽度else{colee_left.scrollLeft++}}varMyMar3=setInterval(Marquee3,speed)colee_left.onmouseover=function(){clearInterval(MyMar3)}colee_left.onmouseout=function(){MyMar3=setInterval(Marquee3,speed)}/script!--向左滚动代码结束--!--下面是向右滚动代码--divid="colee_right"style="overflow:hiddenwidth:500px"tablecellpadding="0"cellspacing="0"border="0"trtdid="colee_right1"valign="top"align="center"tablecellpadding="2"cellspacing="0"border="0"tralign="center"tdpimgsrc="/jscss/demoimg/200907/bg3.jpg"/p/tdtdpimgsrc="/jscss/demoimg/200907/bg3.jpg"/p/tdtdpimgsrc="/jscss/demoimg/200907/bg3.jpg"/p/tdtdpimgsrc="/jscss/demoimg/200907/bg3.jpg"/p/tdtdpimgsrc="/jscss/demoimg/200907/bg3.jpg"/p/td/tr/table/tdtdid="colee_right2"valign="top"/td/tr/table/divscriptvarspeed=30//速度数值越大速度越慢varcolee_right2=document.getElementById("colee_right2")varcolee_right1=document.getElementById("colee_right1")varcolee_right=document.getElementById("colee_right")colee_right2.innerHTML=colee_right1.innerHTMLfunctionMarquee4(){if(colee_right.scrollLeft=0)colee_right.scrollLeft+=colee_right2.offsetWidthelse{colee_right.scrollLeft--}}varMyMar4=setInterval(Marquee4,speed)colee_right.onmouseover=function(){clearInterval(MyMar4)}colee_right.onmouseout=function(){MyMar4=setInterval(Marquee4,speed)}/script!--向右滚动代码结束--/body/html常用JS图片、文字滚动（...大小：1.41K 已经过百度安全检测,放心下载点击下载追问
这是JS的代码？我要的HTML的
