头像

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

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

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

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

查看演示 下载资源: 16 下载资源 下载积分: 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>
最新交易
评论19
头像

系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1556472052

  • 头像 18楼
    03-01 22:28
    li***说的
    可以 资源不错 感觉我是写不出来
  • 头像 17楼
    02-28 12:03
    风***子
    可以的,资源真的不错,使用一下看看效果

  • 头像 16楼
    02-19 17:25
    孤***人
    资源真的不错,可以下载来看看。
  • 头像 15楼
    02-04 23:37
    da***om
    swiper好像是手机端的滚动,不错
  • 头像 14楼
    02-04 18:43
    yu***赫赫
    图片也挺好看的了看挺不错的
  • 头像 13楼
    02-02 11:01
    An***2u
    这个效果不错 值得学习
  • 头像 12楼
    02-02 09:22
    余***鱼
    很棒的特效,使用一下看看效果
  • 头像 11楼
    02-02 09:05
    胡***胡
    还不错的效果,图片也挺好看的!
  • 头像 10楼
    02-02 08:29
    ***大路
    好的效果,值得推荐。
  • 头像 9楼
    02-01 11:53
    时***光
    真的很不错,确实挺好用的
1 2