BootStrap实现手机端轮播图左右滑动事件

前端之家收集整理的这篇文章主要介绍了BootStrap实现手机端轮播图左右滑动事件前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

用bootstrap做出的项目轮播图在手机端不能滑动,为此找了好多插件、框架。但是都不能和bootstrap良好的结合。

功夫不负有心人,经过一番查找终于在github找到了一段js:toucher.js,原文链接

由于个人水平原因代码没看懂抓狂,不过使用还是没问题滴。

第一.在head中加载toucher.js。

第二.在轮播图页面实现触屏事件。

轮播图代码:

js代码

var myTouch = util.toucher(document.getElementById('carousel-example-generic')); myTouch.on('swipeLeft',function(e){ $('#carright').click(); }).on('swipeRight',function(e){ $('#carleft').click(); });

ok手机端可以用了。

以上所述是小编给大家介绍的BootStrap实现手机端轮播图左右滑动事件。编程之家 jb51.cc 收集整理的教程希望能对你有所帮助,如果觉得编程之家不错,可分享给好友!感谢支持

猜你在找的Bootstrap相关文章