首页 > 其他 > 详细

信息滚动条

时间:2016-06-08 15:49:13      阅读:149      评论:0      收藏:0      [点我收藏+]

HTML样式

<div id="recoder_con">
    <div id="recoder_ul1"></div>
    <div id="recoder_ul2"></div>
</div>

父元素样式

.recoder-con{
    display: inline-block;
    width: 584px;     //指定宽度
    height: 280px;    //指定高度
    overflow: scroll;
    overflow-x: hidden;
    overflow-y: hidden;
}

JS引用

 function  prizeScroll(listNum) {
                var speed = 65,
                    wap = document.getElementById("recoder_con"),
                    ul1 = document.getElementById("recoder_ul1"),
                    ul2 = document.getElementById("recoder_ul2");

                ul2.innerHTML = ul1.innerHTML;
                var leftHeight;

                if (listNum > 4) {
                    leftHeight = 0;
                } else if (listNum == 4) {
                    leftHeight = 33;
                }

                function Marquee2() {
                    if (ul2.offsetTop - wap.scrollTop <= leftHeight) {
                        wap.scrollTop -= ul1.offsetHeight;
                    } else {
                        wap.scrollTop++;
                    }
                }
                var MyMar2 = setInterval(function () {
                    Marquee2();
                }, speed);
                
            },

  其中 : 参数 listNum为数据长度

  

  

信息滚动条

原文:http://www.cnblogs.com/qinglingyue/p/5570078.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!