JS-Swiper:使用原生JS实现的无缝轮播图

时间:2021-05-29 17:46:29
【文件属性】:
文件名称:JS-Swiper:使用原生JS实现的无缝轮播图
文件大小:499KB
文件格式:ZIP
更新时间:2021-05-29 17:46:29
js-swiper JavaScript 原生JS无缝轮播图 ,如果无法打开预览,原因是部分运营商DNS污染(域名指往不正确的IP地址),可以通过 修改hosts文件 / 修改DNS服务器 / 代理 的方式访问 HTML部分 最外层是一个固定宽度且带有overflow: hidden;属性的盒子 盒子内是两个列表,一个图片列表,一个point列表 图片列表里的图片是水平排列float: left;的 points-list里的point数量等于需要轮播的图片的数量 每次轮播时会根据此时播放的图片,给对应的point添\u52a0class='active' 可以根据需要给active添加样式 JS部分 封装了一个轮播的方法,其基本原理是: 将图片列表里的图1克隆到最后一个图片后面,创建图1副本 将图片列表里的最后一个图片克隆到图1前面,创建最后一个图片的副本 每次播放到最后一张图片时,接着播放最后一张图片到图1副本的动画 播放完最后一张图片
【文件预览】:
JS-Swiper-master
----images()
--------s2.jpg(94KB)
--------s4.jpg(94KB)
--------s3.jpg(67KB)
--------s1.jpg(45KB)
--------s5.jpg(105KB)
--------s6.jpg(120KB)
----swiper.js(13KB)
----README.md(2KB)
----index.html(9KB)

网友评论