如何使引导轮播触摸幻灯片？

【问题标题】：how to make bootstrap carousel touch slide?如何使引导轮播触摸幻灯片？
【发布时间】：2014-02-28 03:04:30
【问题描述】：

你如何制作引导轮播触摸幻灯片？

有办法吗？调整该代码以使手指能够交换幻灯片？

这里是carousel

【问题讨论】：

标签： jquery twitter-bootstrap twitter-bootstrap-3 carousel

【解决方案1】：

从 http://jquery.com/ 和 http://jquerymobile.com/ 下载 jQuery 和 jQuery 移动库

在您的网站中包含 jQuery 移动库

jQuery 移动库为您提供触控支持。可以添加以下代码

$(document).ready(function() {  
   $("#bsCarousel").swiperight(function() {  
      $("#bsCarousel").carousel('prev');  
    });  
   $("#bsCarousel").swipeleft(function() {  
      $("#bsCarousel").carousel('next');  
   });  
});

【讨论】：

另外，Jacob Thornton 曾一度建议为此使用 eightmedia.github.io/hammer.js。

【解决方案2】：

所有使用类：

使用 Hammer.js

https://github.com/hammerjs/hammer.js

和 jquery.hammer.js

https://github.com/hammerjs/jquery.hammer.js

$('.carousel').hammer().bind('swipeleft', function (event)   {
   $(event.target).carousel('next');
});

$('.carousel').hammer().bind('swiperight', function (event) {
   $(event.target).carousel('prev');
});

【讨论】：

在您的站点中包含hammer.js 和jquery.hammer.js 库