jQuery响应式手机端触屏滑动图片轮播插件

jQuery响应式手机端触屏滑动图片轮播插件-精品资源网
jQuery响应式手机端触屏滑动图片轮播插件
此内容为免费资源,请登录后查看
0
免费资源

jQuery响应式手机端触屏滑动图片轮播插件

jQuery响应式手机端触屏滑动图片轮播插件,含多种图片滑动切换效果可选,兼容PC端与手机端。

js代码

	<script src=\"js/jquery-1.11.0.min.js\" type=\"text/javascript\"></script>
	<script src=\'js/hammer.min.js\'></script>
	<script src=\'js/slider.js\'></script>
	<script>
		$(\'#pbSlider0\').pbTouchSlider({
		slider_Wrap: \'#pbSliderWrap0\',
		slider_Threshold: 10,
		slider_Speed:600,
		slider_Ease:\'ease-out\',
		slider_Drag : true,
		slider_Arrows: {
		  enabled : true
		},
		slider_Dots: {
		  class :\'.o-slider-pagination\',
		  enabled : true
		},
		slider_Breakpoints: {
		    default: {
		        height: 500
		    },
		    tablet: {
		        height: 350,
		        media: 1024
		    },
		    smartphone: {
		        height: 250,
		        media: 768
		    }
		}
		});
		$(\'#pbSlider\').pbTouchSlider({
		slider_Wrap: \'#pbSliderWrap\',
		slider_Threshold: 50,
		slider_Speed:400,
		slider_Ease:\'linear\',
		slider_Drag : false,
		slider_Arrows: {
		  enabled : false
		},
		slider_Breakpoints: {
		    default: {
		        height: 300
		    },
		    tablet: {
		        height: 250,
		        media: 1024
		    },
		    smartphone: {
		        height: 200,
		        media: 768
		    }
		}
		});
		$(\'#pbSlider2\').pbTouchSlider({
		slider_Wrap: \'#pbSliderWrap2\',
		slider_Threshold: 25,
		slider_Speed:1000 ,
		slider_Ease:\'cubic-bezier(.16,.92,0,.8)\',
		slider_Dots: {
		  class:\'.slider-pagination\',
		  enabled : false
		},
		slider_Breakpoints: {
		    default: {
		        height: 300
		    },
		    tablet: {
		        height: 250,
		        media: 1024
		    },
		    smartphone: {
		        height: 200,
		        media: 768
		    }
		}
		});
		$(\'#pbSlider3\').pbTouchSlider({
		slider_Wrap: \'#pbSliderWrap3\',
		slider_Threshold: 50 ,
		slider_Speed:400 ,
		slider_Ease:\'linear\',
		slider_Breakpoints: {
		    default: {
		        height: 400
		    },
		    tablet: {
		        height: 300,
		        media: 1024
		    },
		    smartphone: {
		        height: 200,
		        media: 768
		    }
		}
		});
		</script>

© 版权声明
THE END
点赞0 分享
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片

    暂无评论内容