- 论坛徽章:
- 0
|
垂直滚动特效 - <div id="dome">
- <div id="dome1">
- </div>
- <div id="dome2"></div>
- </div>
- <script type="text/javascript">
- var speed=10; //设置向上滚动速度
- var dome=document.getElementById("dome");
- var dome1=document.getElementById("dome1");
- var dome2=document.getElementById("dome2");
- function moveTop(){
- dome2.innerHTML=dome1.innerHTML //复制dome1为dome2
- if(dome2.offsetTop-dome.scrollTop<=0) //当滚动至dome1与dome2交界时
- dome.scrollTop-=dome1.offsetHeight //dome跳到最顶端
- else{
- dome.scrollTop++
- }
- }
- var MyMar=setInterval(moveTop,speed) //设置定时器
- dome.onmouseover=function() {clearInterval(MyMar)}//鼠标移上时清除定时器达到滚动停止的目的
- dome.onmouseout=function() {MyMar=setInterval(moveTop,speed)}//鼠标移开时重设定时器,继续滚动
- </script>
复制代码 scrollTop:
有些情况下,“元素中内容”的高度会超过“元素本身”的高度,这时候我们有时就会用到scrollTop初始状态下,“内层元素的上边界”和“外层元素的上边界”重合,没有任何内容超过“外层元素的上边界”,此时scrollTop属性的值为0。当向下拖动滚动条时,超过“外层元素的上边界”的内容会逐渐增多,scrollTop值就等于这些超出的部分。
offsetTop:
当前对象到其上级层顶部的距离,不能对其进行赋值.设置对象到页面顶部的距离请用style.top属性.
offsetHeight:
当前元素的高度. |
|