【无标题】数据从下往上循环滚动显示(2种)

   //数据滚动显示
    var scrollBox =document.getElementById('list')
    var scrollList1 =document.getElementById('listDiv1')
    var scrollList2 =document.getElementById('listDiv2')
    autoScroll();
    function autoScroll() {
        scrollList1.innerHTML= getProjects();  //getProjects()函数获取所有数据
        if (scrollList1.offsetHeight > scrollBox.offsetHeight) {
            scrollList2.innerHTML = scrollList1.innerHTML;//克隆list1的数据,使得list2和list1的数据一样
            scrollMove = setInterval(scrollup, 25);//数值越大,滚动速度越慢
            scrollBox.onmouseover = function () {
                clearInterval(scrollMove)
            }
        }
    }
    function scrollup() {
        //滚动条距离顶部的值恰好等于list1的高度时,达到滚动临界点,此时将让scrollTop=0,让list1回到初始位置,实现无缝滚动
        if (scrollBox.scrollTop >= scrollList1.offsetHeight) {
            scrollBox.scrollTop = 0;
        } else {
            scrollBox.scrollTop++;
        }
    }
    //鼠标离开时,滚动继续
    scrollBox.onmouseout = function () {
        scrollMove = setInterval(scrollup, 25);
    }

第二种方法:

   var list = document.getElementById("list").getElementsByTagName("ol")[0]; 
   var timer = null;
   list.innerHTML += list.innerHTML;
   function marquee() {
       list.style.top = list.offsetTop - 3 + "px";
       if((list.clientHeight*document.getElementsByTagName("ol").length+list.offsetTop)<330){
           // list.style.top = "310px";
           $(list).animate({top:"0px"},1);
       }
   }

   timer = setInterval(marquee, 200);

   list.onmouseover = function () {
       clearInterval(timer);
   }
   list.onmouseout = function () {
       timer = setInterval(marquee, 200);
   }


版权声明:本文为m0_49214600原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。