nciaer 发表于 2019-2-15 23:26:23

js上下文字滚动代码

就是每隔几秒,文字向上滚动,纯js实现的。一般用来做新闻啊或者公告啥的,很常用,记下来,反正自己也写不出来。:(
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
      .llx-announce #div2 {
      height: 22px;
      overflow: hidden;
      }
      .llx-announce a {
            overflow: auto;
            display: block;
            line-height: 22px;
            text-decoration: none;
      }
    </style>
</head>
<body>
<div class="llx-announce">
    <div id="div2">
      <a href="#">这是标题一</a>
      <a href="#">这是标题二</a>
      <a href="#">这是标题三</a>
    </div>
</div>
<script>
    var box = document.getElementById("div2"), can = true;
    box.innerHTML += box.innerHTML;
    box.onmouseover = function () {
      can = false
    };
    box.onmouseout = function () {
      can = true
    };
    new function () {
      var stop = box.scrollTop % 22 == 0 && !can;
      if (!stop) box.scrollTop == parseInt(box.scrollHeight / 2) ? box.scrollTop = 0 : box.scrollTop++;
      setTimeout(arguments.callee, box.scrollTop % 22 ? 10 : 3000);
    };
</script>
</body>
</html>


页: [1]
查看完整版本: js上下文字滚动代码