JavaScript中列表自动滚动--兼容缩小页面百分比

1.前端页面结构

<div id="cont">

        <ul id="ullist1">

                <li></li>...

        </ul>

        <ul id="ullist2"></ul>

</div>

2.js

function autoRoll(t){

           var ul1 = document.getElementById("ullist1");

          var ul2 = document.getElementById("ullist2");

          var content = document.getElementById('cont');

          ul2.innerHTML = ul1.innerHTML;

          content.scrollTop = 0;

          var timer = setInterval(rollStart, t);

          content.onmouseover = function(){

                    clearInterval(timer);

          }

          content.onmouseout = function(){

                    timer = setInterval(rollStart, t);

          }

}

function rollStart(){

         var ul1 = document.getElementById("ullist1");

          var ul2 = document.getElementById("ullist2");

          var content = document.getElementById('cont');

          const radios = parseFloat((1 / window.devicePixelRatio).toFixed(2)) + 0.01;//兼容到浏览器页面百分比缩小时也能自动滚动；

          if (content.scrollTop >= ul1.scrollHeight) {

                    content.scrollTop = 0;

          } else {

           content.scrollTop = content.scrollTop + radios;

          }

}

3.css

#cont{overflow:hidden};//重要

4.调用函数

autoRoll（50）；