菜鸟笔记—关于轮播图片滚动时会产生间隔的问题

最新推荐文章于 2023-04-30 23:56:25 发布

踏云飞

最新推荐文章于 2023-04-30 23:56:25 发布

阅读量1.4k

点赞数 1

本文链接：https://blog.csdn.net/weixin_44545673/article/details/95050544

版权

本文探讨了前端轮播图片滚动时产生间隔的常见问题，指出问题可能源于缺少过渡图片。通过添加衔接图片，可以有效解决轮播过程中出现的间隔现象。同时，文章提及JQuery和纯Javascript实现轮播的不同理解难度。

摘要由CSDN通过智能技术生成

在前端的页面布局中轮播总有它的用武之地，而有些人的轮播图片，总会出现这样那样的问题比如说计时器写完后轮播图片不滚动的，轮播图片滚动时间长了图片滚动逐渐加速导致鼠标移入事件失效，轮播图片滚动时图片产生间隔的等等一系列的问题。

今天来说一下轮播图片滚动时间长了图片产生间隔的一种可能性，图片产生间隔不一定是代码的逻辑有了问题，而是图片没有衔接起来，图片本身是在运动的，只没有用于过渡的图片来衔接导致图片在滚动时产生了间隔而已，如何解决这个问题呢？

在div标签里不会产生间隔的样式：

<div class="list" id="list" style="position: absolute; left: -400px;"> 
    <img src="images5.jpg" alt="">
    <img src="images1.jpg" alt="">//标红
    <img src="images2.jpg" alt="">//标红
    <img src="images3.jpg" alt="">//标红
    <img src="images4.jpg" alt="