自制基于jq的轮播图插件,pc端就是普通的向左向
功能
自制基于jq的轮播图插件,pc端就是普通的向左向右功能,手机端则是无缝切换功能
如何使用 先在html文件里写如下html模板:<div class="img-slider">
<div class="slider-img-wrapper">
</div>
<a href="javascript:;" class="go-former-link"><</a>
<a href="javascript:;" class="go-latter-link">></a>
<div class="img-sign-wrapper">
</div>
</div>
在你的html文件里引入css和js文件
最后一步,在你的js文件里配置即可,如下:
$(".img-slider").sliding({
img_src: ["img/image-slider/1.jpg", "img/image-slider/2.jpg", "img/image-slider/3.jpg"],
img_src_pc_version: ["img/image-slider/1_pc.jpg", "img/image-slider/2_pc.jpg", "img/image-slider/3_pc.jpg" ]
});
##各配置项说明
img_src和img_src_pc_version前者指明移动端的图片地址,后者指明pc端的图片地址,图片地址都放在一个array当中
mobile_img_height和pc_img_height指定图片的高度,类型为字符串,如"3.0625rem"
transitionTime仅针对移动端的参数,指定每次手指脱离时切换两张图片时的运动的毫秒数
click_btn_least_gap仅针对pc的参数,指定用户两次点击切换图片按钮间的最少时间间隔的毫秒数,是为防止用户连续点击而连续切换图片。
版权声明:
1、该文章(资料)来源于互联网公开信息,我方只是对该内容做点评,所分享的下载地址为原作者公开地址。2、网站不提供资料下载,如需下载请到原作者页面进行下载。