会社で保守をまかされているサイトのスマホサイトを制作することになりました。レスポンシブでスマホに対応させることは何度かありましたが、スマホ専用サイトを作成するのは、初めてです。 レスポンシブやIOSのインターフェイスデザインの経験でデザインする分には問題ありませんでしたが、フリックの実装にはまりました。いくつか公開されているjsを導入しましたが、フリックエリアを縦にこすりつけるようにフリックするとjsの動作が止まるという仕様のものが多くて困りました。実際にそのような操作をされることは稀なのでしょうが、不具合があると分っている物を納品するわけにはいかず、色々と試してみました。そして今回はflipsnap.jsを使わせていただくことにしました。

flipsnap.js

導入してみて僕の検証環境ではAndroidでもIOSでもバッチリ動いています。上記のようなバグもありません！ポートレートでもランドスケープでもスムーズです。導入方法もサイトに詳しく掲載されています。英語ですが・・・ソースをみれば何となくわかりました！僕もそのうち自前で書いてみたいです。

flipsnap.jsはこちらから