100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > swiper轮播插件的使用

swiper轮播插件的使用

时间:2023-09-17 08:56:28

相关推荐

swiper轮播插件的使用

swiper轮播插件的使用

引入js文件

<script src="./js/swiper-3.4.2.min.js"></script>

接收后台返回的轮播数据,循环append进去,在append之后new swiper对象

$.each(data['data'],function(i){list_item += '<div class="swiper-slide">';list_item += '<img src="./img/turn_logo.jpg" data-lazyload="'+data['data'][i]['FileUrl']+'" onload="lazyload(this)" alt="">';list_item += '</div>';}) $(".swiper-wrapper").append(list_item);}var swiper = new Swiper('.swiper-container', {pagination: '.swiper-pagination',paginationClickable :true,effect: 'cube',grabCursor: true,cube: {shadow: false,slideShadows: false,shadowOffset: 0,shadowScale: 0}});

备注1.
对于插件的使用是很简单的,大神请绕道 ↩

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。