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

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

2021-03-13 4,128
下载不了?请联系网站客服提交链接错误!
增值服务: 安装搭建 使用指导 售后服务 修复改版 专业仿站 定制开发 若有其它需求请联系客服
Swiper全屏自适应焦点图轮播代码 - 模板团

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

ID1537 网页特效 2021-03-14 4,128
郑重承诺丨模板团提供安全交易、信息保真!
增值服务:
安装搭建
使用指导
售后服务
修复改版
专业仿站
定制开发
¥ 0 开通会员尊享海量资源下载特权!
立即下载 开通会员 加入QQ群

一家有态度的精品资源分享平台

进入TA的商铺 联系模板团官方客服
详情介绍

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

 

js代码

<script type="text/javascript" src="js/swiper.min.js"></script>
<script type="text/javascript">
window.onload = function() {
var swiper = new Swiper('.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-slide swiper-slide-active";
},
breakpoints: {
668: {
slidesPerView: 1,
}
}
});
}
</script>

 

资源下载此资源仅限注册用户下载,请先
收藏 (0) 打赏

您的支持是我们前进最大的动力!

打开微信扫一扫,即可进行扫码打赏哦
点赞 (0)

一家有态度的精品资源分享平台

常见问题

你们的模板能保证和效果图一样吗?

  • 模板团承诺演示效果图均和网站一模一样,如有不同,全额退款,并且我们的模板和数据都没有留后门,请放心使用。

购买过的模板,想退换,可以吗?

  • 因为模板具有可复制性和可传播性,模板一旦发货,非质量问题,不支持退换;所以务必请您一定看清楚后再购买。

相关文章

评论
暂无评论
  • 0 +

    访问总数

  • 0 +

    会员总数

  • 0 +

    资源总数

  • 0 +

    今日发布

  • 0 +

    本周发布

  • 0 +

    运行天数

开通会员,尊享海量资源下载特权