jquery+css实现图片自动播放

最新推荐文章于 2024-09-06 18:18:08 发布

码农遇见菜鸟

最新推荐文章于 2024-09-06 18:18:08 发布

阅读量100

点赞数

文章标签： jquery css 前端

本文链接：https://blog.csdn.net/weixin_40597855/article/details/132765826

版权

jquery+css实现图片自动播放

// css
.partner{width:95%;overflow: hidden;padding:10px;margin: 0 auto;}
.partnerlist{display:flex;}
.partnerlist div{width: 300px;padding: 50px 100px;}
.partnerlist img{width:80px;}
<div class="partner">
	<div class="partnerlist">
	            <div><img src="/uploads/20230908/bce605c666164a9ca417fa9246bcc174.webp"></div>
	            <div><img src="/uploads/20230908/bce605c666164a9ca417fa9246bcc174.webp"></div>
	            <div><img src="/uploads/20230908/bce605c666164a9ca417fa9246bcc174.webp"></div>
	            <div><img src="/uploads/20230908/bce605c666164a9ca417fa9246bcc174.webp"></div>
	            <div><img src="/uploads/20230908/bce605c666164a9ca417fa9246bcc174.webp"></div>
	 </div>
 </div>



 var i=100;
    setInterval(()=>{
        i++;
        // $(".partnerlist").css("transform","translate(-"+i+");");
        if(i<2400){
            $(".partnerlist").css("transform","translate(-"+i+"px)");
        }else{
            i=0;
            $(".partnerlist").css("transform","translate(0)");
        }
    },25)