欢迎您  本站地址:   Swiper全屏自适应焦点图轮播代码-小库平台

小库平台

 找回密码
 立即注册
Swiper全屏自适应焦点图轮播代码-小库平台

小库平台

 找回密码
 立即注册
上一主题 下一主题

Swiper全屏自适应焦点图轮播代码

跳转到指定楼层
楼主
|只看大图 回帖奖励 |倒序浏览 |阅读模式

这是一款基于Swiper实现的全屏自适应焦点图轮播代码,点击箭头按钮或拖动图片左右滚动切换到中间展示大图。

js代码
<scripttype="text/javascript"src="js/swiper.min.js"></script>
<scripttype="text/javascript">
window.onload=function(){
varswiper=newSwiper('.swiper-container',{
autoplay:false,
speed:1000,
autoplayDisableOnInteraction:false,
loop:true,
centeredSlides:true,
slidesPerView:2,
pagination:'.swiper-pagination',
paginationClickable:true,
prevButton:'.swiper-button-prev',
nextButton:'.swiper-button-next',
onInit:function(swiper){
swiper.slides[2].className="swiper-slideswiper-slide-active";
},
breakpoints:{
668:{
slidesPerView:1,
}
}
});
}
</script>


下载
回复

使用道具 举报

小黑屋|小库平台

GMT+8, 2024-9-20 07:56 , Processed in 3.878425 second(s), 19 queries , Xcache On.

Powered by Discuz! 3.4

小库提示

扫描下方二维码,访问手机版。