向上滚动

<div>
<div id="roll_body" style="width:785px;height:150px; overflow:hidden; border:1px solid #FFCC33;">
<div id="roll_01" >
<div style=" margin:0; padding:0;width:785px;height:150px;border:2px solid #66FF00;">
    //此处省略滚动内容
</div>
<div style="clear:both"></div>
<div style=" margin:0; padding:0;width:785px;height:150px;border:2px solid #33CCCC;">
    //此处省略滚动内容
   </div>
<div style="clear:both"></div>
<div style=" margin:0; padding:0;width:785px;height:150px;border:2px solid #3300FF;">
</div>
</div>
<div id="roll_02"></div>
</div>
<div style="clear:both"></div>
</div>
//下面为脚本实现
<script type="text/javascript">
var table_height=154;//这个相当天路程
var speed=1;
var mode=false;
var pause_time=100;//这个是设置它的暂停时间的,试着把它设置0看看;
var steph=0;
var stept=10;
var demo=document.getElementById("roll_body");
var demo2=document.getElementById("roll_02");
var demo1=document.getElementById("roll_01");
demo2.innerHTML=demo1.innerHTML;
function Marquee(){
if(mode==true)return;
steph+=1;
if (steph>table_height){
stept+=1;
steph-=1;
if(stept>=pause_time){
steph=0;
stept=0;
}
}else{
demo.scrollTop+=1;
if(demo.scrollTop >=table_height*3) {
demo.scrollTop = 0;
}
}
}
MyMar=setInterval(Marquee,speed);
demo.onmouseover=function() {clearInterval(MyMar)};
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)};
</script>

你可能感兴趣的:(滚动)