js 特效一 字体滚动

来源:互联网 发布:淘宝购买人数太多 编辑:程序博客网 时间:2024/05/22 01:45
<div align="center" id="demo" style="overflow:hidden;height:200px;width:600px;border:1px solid #000;">
<div id="demo1">js滚动效果</div>
<div id="demo2"></div>
</div>
<script>
var demo = document.getElementById("demo");
var demo1 = document.getElementById("demo1");
var demo2 = document.getElementById("demo2");
var speed=10;
var nnn=200/demo1.offsetHeight;                                             //offsetHeight 小于容器的高度的时候,scollTop 就没有用了
function Marquee(){
   if(demo2.offsetTop-demo.scrollTop<=0){
   demo.scrollTop-=demo1.offsetHeight ;
   }else{
   demo.scrollTop++
   }
var MyMar = setInterval(Marquee,speed); 
emo.onmouseover = function(){clearInterval(MyMar)}    //鼠标经过时清除定时器达到滚动停止的目的
demo.onmouseout = function(){MyMar = setInterval(Marquee,speed)}    //鼠标移开时重设定时器
}

</script>

//这里需要区分

offsetHeight = 内容可视区域的高度+ 滚动条 + 边框。obj.offsetTop 指 obj 距离上方或上层控件的位置scrollTop() 方法返回或设置匹配元素的滚动条的垂直位置

0 0