[Javascript-便利なスクリプト] スマフォサイト向けフリック・スワイプ可能なjQueryスライダー
スマートフォン向けサイトで、フリック・スワイプ可能なスライダーを実装できるjQueryプラグインです。 動作対象は「iPhone」「Android」「iPad」になっています。 ただし、注意事項として
※コメントにも頂いておりますが、この公開版はバグがありますので、承知の上でご利用になるか、ご自身でカスタマイズされる方がお使いください。
基本的に、jsを編集できる方が使用したほうがいいかもしれません。 ダウンロードはこちらから↓ スマートフォンサイトにフリック・スワイプ実装できるjQueryスライダプラグイン このページでは、実装方法は省略させて頂きます(本家サイトを参照下さい)。 カスタマイズ回りをちょくちょく書いていこうかと。 いじったら書き足していきます。
FlickSlideの動作対象端末(UA)を追加する
上で書いたとおり、このプラグインは「iPhone」「Android」「iPad」で動作します。 例えば、iPodを追加したいといった場合はどうすれば良いのか ソースコード中に下記のような配列を作成する文があります。
webkitUA=['iphone','android','ipad']
ここに
webkitUA=['iphone','android','ipad', 'ipod']
と追加してやればOK
フリックした後にスライドをタップするとスライドが切り替わる(バグ?)
これは、なかなか不都合が多い部分。 スライド単位でリンクを設定したいとする人も少なくないはず(リンクをタップしたと同時にスライドも動いてしまうのは気持ち悪い)。 そこで、突貫工事。 16行目
slideTimer=setTimeout(lotation,slideDuration);slideLock=0;}}
を
slideTimer=setTimeout(lotation,slideDuration);slideLock=0;diffX = 0;}}
のようにdiffXに0を代入してやることで、期待通りの動作をするかと思います。 (本当にかなり突貫でいじったので正しいかどうかは謎ですが…)
「jQuery」に関する「本」の商品を自動的に表示しています。
キーワードに関連していない商品は、Amazonがオススメする商品です。気になる物があればどうぞ。
キーワードに関連していない商品は、Amazonがオススメする商品です。気になる物があればどうぞ。
作成日:2012年02月09日(Thu)