jQuery Mobile の swipe を調整
このサイトの gwaw.jp 2014 と gwaw.jp mobile は、スマートフォン用に jQuery Mobile を利用しています。
そして、ページ送りにスワイプを試しています。
ただ、これまで操作感が思っていたよりちょっと違っていたので、気にしていました。
そこで、JQuery Mobile API Documentation の swipe ページ http://api.jquerymobile.com/swipe/ を参照して、ちょっと調整をいれてみました。
$.event.special.swipe.scrollSupressionThreshold (default: 10px) – More than this horizontal displacement, and we will suppress scrolling.
(この水平変位よりスクロールを抑制する。)
$.event.special.swipe.durationThreshold (default: 1000ms) – More time than this, and it isn’t a swipe.
(この時間以上はスワイプとしない。)
$.event.special.swipe.horizontalDistanceThreshold (default: 30px) – Swipe horizontal displacement must be more than this.
(スワイプ水平変位は、これ以上でなければならない。)
$.event.special.swipe.verticalDistanceThreshold (default: 75px) – Swipe vertical displacement must be less than this.
(スワイプ垂直変位は、これより小さくなければならない。)
デフォルトでは、ちょっとしたタッチのブレでもスワイプしてしまい、感度が高く感じられましたので、これまではスワイプしにくいように設定していましたが、今回は、もう少し見直してみました。
$.event.special.swipe.scrollSupressionThreshold = 60;
(スクロールタッチのちょっとした水平方向のブレでスクロール抑止になるため、数値をデフォルトより増やしています。)
$.event.special.swipe.durationThreshold = 1000;
(デフォルトのままとしています。)
$.event.special.swipe.horizontalDistanceThreshold = 60;
(ちょっとしたタッチの水平方向の動きでスワイプとなるため 、数値をデフォルトより増やしています。)
$.event.special.swipe.verticalDistanceThreshold = 20;
(たとえばナナメ方向のちょっとしたタッチの動きでスワイプとなるため 、数値をデフォルトより減らしています。)
このサイトでは、ページ送りのときにページ読み込みをしているため、スワイプ本来の体験は得られませんが、機会を見つけて JQuery Mobile のスワイプをいかしてみたいと思います。