jQuery+swiper.js带标签图片视差滚动切换代码,左右箭头按钮控制两层图片横向滚动轮播。效果非常不错,本例宽度较窄,改成通栏banner更显大气。
js代码
<script src="js/swiper.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
//最里层轮播
var mySwiper1 = new Swiper('#swiper1',{
loop: true,
autoplay : 2500,
speed : 600,
autoplayDisableOnInteraction : false
});
//上层轮播
var mySwiper2 = new Swiper('#swiper2',{
loop: true,
autoplay : 2500,
speed : 600,
slidesPerView :2,
autoplayDisableOnInteraction : false
});
//前进后退按钮
$(".left").click(function(){
mySwiper1.slidePrev();
mySwiper2.slidePrev();
})
$(".right").click(function(){
mySwiper1.slideNext();
mySwiper2.slideNext();
})
</script>
系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791