Swipe JSスライドプラグイン

Swipe JSは軽量級の移動スライド組立品で、1:1のタッチ移動をサポートしています.抵抗と滑り止めの性能はいいです.モバイルwebアプリケーションにより多くの内容を見せることができます.モバイルWebの滑りに対するニーズを解決できます.
公式サイト:http://www.swipejs.comgithub:https://github.com/bradbirdsall/Swipe
Swipeのスライドとジェスチャーを実現するには非常に簡単で、簡単なルールに従う必要があります.以下は一例です.

<div id='slider' class='swipe'>

  <div class='swipe-wrap'>

    <div>1</div>

    <div>2</div>

    <div>3</div>

  </div>

</div>

中に包まれた三つのDIVはスライドのモジュールです.スライダが終わった後やページの下にイベントコードを追加します.

window.mySwipe = Swipe(document.getElementById('slider'));

もちろんイベントを追加した後、スライドが正常に動作するように基礎的なパターンを追加します.

.swipe {

  overflow: hidden;

  visibility: hidden;

  position: relative;

}

.swipe-wrap {

  overflow: hidden;

  position: relative;

}

.swipe-wrap > div {

  float:left;

  width:100%;

  position: relative;

}

ここで全体のスライド効果が完成しました.携帯電話でテストしてください.
Swipe 2.0はさらに多くのパラメータ設定を提供しています.

startSlide インテグ (default:0) - index position Swipe shoruld start at(スライドのインデックス値、すなわち*値からスライドし、デフォルト値は0)

speed インテグ (default:300) - speed of prev and next trantions in miliseconds.(スライドの速度、デフォルト値300 ms)

atot Integer-begin with aut sladeshow(time in miliseconds between slaides)(自動スライド、単位はミリ秒)

continuous ボロア (default:true) - create an infinite feel with no endpoints(ループスライドするかどうか、デフォルト値はtrue)

disable Scrroll ボロア (default:false) - stop any touches on this container from scrolling the page(この容器に触れてページをスクロールするのを停止します.標準値flase)

stopPropagation ボロア (default:false) - stop event propagation(イベントの伝播を停止し、デフォルト値flase)

calback Function-runs at slade change.(コールバック関数)

transitionEnd Function-runs at the end slade transition.(遷移時に呼び出す関数)

パラメータ付きのクリを挙げます.window.mySwipe=new Swipe(document.getElemenntById('sder)、{startSlide:2、speed:400、atot:3000、contious:trfudidiscscscable,Edededededededededededededededededededededededededededededededededededededededededefifififittttttttttttttttttttttttttttttttttttttttttttttindex,elem){}           
Swipe 2.0が提供するAPIprev() slade to prev(前ページ)next() slade to next(次ページ)getPos() returns current slade index position(現在のインデックス位置を取得)getNumSlides() returns the total amount of slades(全スライダ総数を取得)slide(index, duration) slade to set index position(duration:speed of transion in miliseconds)(インデックス、持続時間)スライド設定インデックス位置(継続時間:変換速度はミリ秒単位)
1.0と比較して、2.0は多くの改善を行い、より多くのAPI設定があり、各種WebAppの開発フレームより、Swipeも自分の長所と短所があります.
利点:
滑りと滑り止めの性能はとてもいいです.ユーザーが体験するのは簡単で、カスタマイズが便利です.
短所:
切換え後の箱の高さは切替え内容の最大高さに依存します.もしある箱に内容がないと、空白領域が現在選択されている状態が現れます.滑りが終わってから、混合開発が起動される時、jsコードは煩雑です.