pbTouchSlider 是一款基于 jQuery 的滑动响应式幻灯片插件，它除了一般幻灯片基本的如箭头控制、圆点控制、缩略图功能外，还支持响应式设计和滑动控制，同时 pbTouchSlider 还可以针对平板、手机设备分别设置高度，这使得 pbTouchSlider 能够适应各种设备。
pbTouchSlider 还可以为每个幻灯片添加标题和描述，自带的样式还可以让标题和描述以动画的方式展示。
使用方法
1、引入文件
<linkrel="stylesheet"href="css/style.css"><linkrel="stylesheet"href="css/entypo.css"><scriptsrc="js/jquery.min.js"></script><scriptsrc="js/hammer.min.js"></script><scriptsrc="js/slider.js"></script>
style.css 为插件样式（有若干修改），entypo.css 为开源字体图标，主要使用了左右箭头，hammer.min.js 用于实现滑动拖拽，slider.js 为 pbTouchSlider 插件核心代码。
2、HTML
<divclass="o-sliderContainerhasShadow"id="zztukuWrap"><divclass="o-slider"id="zztuku"><divclass="o-slider–item"data-image="images/5.jpg"></div><divclass="o-slider–item"data-image="images/6.jpg"></div><divclass="o-slider–item"data-image="images/1.jpg"></div><divclass="o-slider–item"data-image="images/2.jpg"></div><divclass="o-slider–item"data-image="images/3.jpg"></div><divclass="o-slider–item"data-image="images/4.jpg"></div></div></div>
3、JavaScript
$(function(){$('#zztuku').pbTouchSlider({slider_Wrap:'#zztukuWrap');});
配置
属性
名称类型默认值说明slider_Wrap字符串null必填，幻灯片的父级元素slider_Item字符串.o-slider–item必填，幻灯片的父级元素slider_Drag布尔值null是否可滑动切换slider_Dots对象null是否显示圆点slider_Arrows对象null是否显示箭头slider_Threshold整数nullslider_Speed整数null切换动画持续时间slider_Ease字符串null切换动画函数slider_Breakpoints对象null针对不同的设备设置不同高度
GitHub 地址：https://github.com/pirolab/pirolab.github.io
产品猿社区致力收录更多优质的商业产品，给服务商以及软件采购客户提供更多优质的软件产品，帮助开发者变现来实现多方共赢；
日常运营的过程中我们难免会遇到各种版权纠纷等问题，如果您在社区内发现有您的产品未经您授权而被用户提供下载或使用，您可按照我们投诉流程处理，点我投诉；
本文来自用户发布投稿，不代表产品猿立场 ；若对此文有疑问或内容有严重错误，可联系平台客服反馈；
部分产品是用户投稿，可能本文没有提供官方下下载地址或教程，若您看到的内容没有下载入口，您可以在我们产品园商城搜索看开发者是否有发布商品；若您是开发者，也诚邀您入驻商城平台发布的产品，地址：点我进入；
如若转载，请注明出处：https://www.chanpinyuan.cn/3950.html；
