花落知雨 花落知雨

2018-10-15

in 记点事情,学习 read (1016) 文章转载请注明来源!

最近一直在学蔚蓝网的项目,今天主要是学了图片的轮播和文字列表的循环滚动,图片的轮播时使用了show()和hide(),然后使用setInterval()设置循环时间,文字列表滚动也是使用的setInterval()循环滚动,使用animate()将列表上移达到滚动效果,效果如下
1.gif
代码大致如下:

<script>
    var bb = false;
    var n = 0;
    setInterval(function() {
        if(bb) {
            return;
        }
        if(n == 640) {
            n = 0;
        }
        $("#express").animate({
            "margin-top": -n
        }, 0);
        n++;
    }, 66);
    $("#dome1").mouseover(function() {
        bb = true;
    }).mouseout(function() {
        bb = false;
    });
</script>

采用了animate()方法将文字列表的上边距调整位负数达到滚动的效果,然后使用setInterval()设置滚动的速度

记点事情学习
发表新评论
已有 2 条评论
  1. 冯小贤
    冯小贤Chrome 70
    回复

    流啤

    1. 吃枣药丸
      吃枣药丸本文作者 10Chrome 69
      回复

      @冯小贤 不流啤,不流啤

前篇 后篇