slides 帶手勢的圖片滑動效果（用於移動終端）

slidesjs 是基於jQuery開發的一款功能強大,是簡單的幻燈片插件，但是需要要應用於移動終端的話，還需要考慮手勢滑動時候圖片切換功能。

　　此次，我就在slidesjs基礎上擴展了兩個swipe屬性"swiperight","swipeleft"。

// swipe right
if (option.swiperight)
{
    control.bind('swiperight',function(){
        if (option.play) {
            pause();
        }
        animate('prev', effect);
    });
}

// swipe left
if (option.swipeleft)
{
    control.bind('swipeleft',function(){
        if (option.play) {
            pause();
        }
        animate('next', effect);
    });
}

 

這樣在用slidesjs時候，只需要設置兩個屬性為“true”，如下：

$(document).ready((function(){
   $('#slides').slides({
        preload: true,
        preloadImage: 'images/loading.gif',
        play: 3000,
        pause: 1000,
        hoverPause: true,
        swiperight:true,
        swipeleft:true
    });
}));

這樣，WEB端網頁用移動終端訪問，圖片滾動也能支持手勢了。

代碼下載：http://dl.vmall.com/c0bvwjdbyk