JS实现marquee滚动效果的实例详解

无缝循环marquee滚动JS代码实现，兼容IE, FireFox, Chrome，供大家参考，具体内容如下

首先是CSS和HTML如下:

  #marquee_zxd {
    border: 1px solid red;
    white-space: nowrap;
    overflow: hidden;
    width: 500px;
    padding-top: 5px;

  }

  #marquee_zxd img {
    height: 100px;
  }

<!--　横向一定要是span -->
    <p id="marquee_zxd"><span>
      <!-- 内嵌一个p很重要，里面的元素必须是一个整体的移动。另外横移时，必须是行级元素只占自己的空间。 -->
      <p id="marquee_inner" style="position:relative; display: inline-block;">
      <img src="img/duck.png"/>
      <img src="img/donkey.png"/>
      <img src="img/eggbird.png"/>
      <img src="img/elephant.png"/>
      <img src="img/butterfly.png"/>
    </p>
    </span></p>

<script type="text/javascript" src="${cpath}/js/marquee_zxd.js"></script>

下面是JS实现marquee_zxd.js：

【相关推荐】

1. Javacript免费视频教程

2. JS实现上传图片并且能够预览的实例详解

3. 移动端手指放大缩小插件代码详解

4. bootstrap手风琴折叠的教程详解

5. bootstrap模态框远程实例详解

以上就是JS实现marquee滚动效果的实例详解的详细内容，更多请关注Gxl网其它相关文章！