多语言展示
当前在线:1965今日阅读:167今日分享:16

jquery实现图片轮播控制,自动播放图片

jquery实现图片轮播控制,自动播放图片,本文通过jquery的组件swiper实现图片轮询控制
工具/原料
1

jquery swiper

2

jquery swiper

方法/步骤
2

找到网站的下载文件地址,如下图所示的位置,下载好解压到项目文件夹,引入即可

3

当然也可以 用npm安装npm install swiper或者直接cdn引入如下所示将官方cdn复制到我们需要该插件的网页,我这里复制一下两个,如图二所示记得将cdn引入的4.x.x变成你实际引入的版本

4

我这里下载两个swiper 文件 ,然后新建一个swiper 文件夹 里面 新建一个 css   js文件夹,如下所示结构

5

div部分我们这样修改 

   
   
   
   
 
 
   底部注以img里面放入的是图片链接地址

6

js和头部部分 css样式 js部分引入

注意事项

注以正确引入 swiper

推荐信息