bootstrap大圖輪播手機端不能手指滑動解決辦法

網上看了很多解決辦法，幾乎本質都是一樣的，都是引入一個滑動的js插件，加入一段js代碼，即可生效，但是我試了hammer.js 和 touchSwipe.js 都不生效，也找不到原因是什麼，目前在網上就找到 toucher.js 可以實作，貼到部落格，留作備用：

<code> </code><code>1 &lt;script&gt; </code>

<code> </code><code>2     $(</code><code>function</code><code>(){ </code>

<code> </code><code>3         </code><code>var</code> <code>myTouch = util.toucher(document.getElementById(</code><code>'carousel-index'</code><code>)); </code>

<code> </code><code>4         myTouch.on(</code><code>'swipeLeft'</code><code>,</code><code>function</code><code>(e){ </code>

<code> </code><code>5             $(</code><code>'.right'</code><code>).click(); </code>

<code> </code><code>6         }).on(</code><code>'swipeRight'</code><code>,</code><code>function</code><code>(e){ </code>

<code> </code><code>7             $(</code><code>'.left'</code><code>).click(); </code>

<code> </code><code>8         }); </code>

<code> </code><code>9     })</code>

<code> </code><code>10 &lt;/script&gt;</code>

擷取的id為整個大圖輪播最外層的id，

$('.right')、$('.left') 為左右點選箭頭的類名，如輪播不需要左右箭頭，給箭頭加 display:none; 就可以。

本文轉自 蓓蕾心晴 51CTO部落格，原文連結：http://blog.51cto.com/beileixinqing/1905169，如需轉載請自行聯系原作者