头像

jQuery+swiper.js带标签图片视差滚动切换代码

来源:http://www.sucaihuo.com/js/3435 素材火管理员 2018-01-31 17:13浏览(241) 收藏

jQuery+swiper.js带标签图片视差滚动切换代码,左右箭头按钮控制两层图片横向滚动轮播。效果非常不错,本例宽度较窄,改成通栏banner更显大气。
jQuery+swiper.js带标签图片视差滚动切换代码
分类:图片代码 > 按钮控制 难易:初级

程序员,你不是一个人;网站开发QQ群:35291327,在线充值,或联系QQ416148489直接充值

查看演示 下载资源: 5 下载资源 下载积分: 20 积分

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>
评论18
头像

友情提示:垃圾评论一律封号,下载出错或者资源有问题请联系全栈客服QQ 416148489

  • 头像 17楼
    前天 02-19 17:25
    孤独诗人
    资源真的不错,可以下载来看看。
  • 头像 16楼
    02-04 23:37
    darkboom
    swiper好像是手机端的滚动,不错
  • 头像 15楼
    02-04 18:43
    yuci赫赫
    图片也挺好看的了看挺不错的
  • 头像 14楼
    02-02 11:01
    Andy_2u
    这个效果不错 值得学习
  • 头像 13楼
    02-02 09:22
    余小鱼
    很棒的特效,使用一下看看效果
  • 头像 12楼
    02-02 09:05
    胡胡
    还不错的效果,图片也挺好看的!
  • 头像 11楼
    02-02 08:29
    大路
    好的效果,值得推荐。
  • 头像 10楼
    02-01 11:53
    时光会反光
    真的很不错,确实挺好用的
  • 头像 9楼
    02-01 11:22
    richer
    游戏范儿的样式,总是很酷酷滴!
  • 头像 8楼
    02-01 09:36
    &开到荼靡?
    还不错,值得学习。 看了看挺不错的
1 2