swiper怎么在HTML引入JS文件,js引入swiper轮播插件

html页面引入swiper的css和js。(具体版本可自行去官网找寻)

https://www.swiper.com.cn/

js部分：swiper为3.4.2版本

/* swiper轮播组件 */

var swiper = new Swiper('.swiper-container', {

effect: 'fade',//控制轮播图的切换效果

prevButton: '.swiper-button-prev',//上一张

nextButton: '.swiper-button-next',//下一张

loop: true,//循环播放

pagination: '.swiper-pagination',//轮播下方小圆点

paginationClickable: true,//下方小圆点可点击

autoplay: 2000,//自动播放

});

/*鼠标移入停止轮播，鼠标离开 继续轮播*/

$('.swiper-container').mouseenter(function () {

swiper.stopAutoplay();

}).mouseleave(function () {

swiper.startAutoplay();

})

html部分

PC效果图

轮播图.png

唯唯诺诺工作，兢兢业业加班