http://qiita.com/items/64e4589e37944bf032d9

こちらで紹介されてるスライドメニューの縦板をテストしてみた。
普通にスマホでjQueryとかでアニメーションをやろうとすると、かなりもっさりしてしまう。
そこで、スマホだからこそcss3を使って実装する視点、確かにそうだよねと脱帽。

処理はシンプルで、touchイベントを使ってtouch.start, touch.endでの挙動をそれぞれ制御し、
スライドすべき時にクラスをつけている、って感じだ。
しかしCSS3の-webkit-transition,あなどれない、、、これはいけるやんか。

サンプル:http://shnr.net/samples/m.slide/

これで良い感じの縦スライドが実装できる。


Leave a Reply

Your email address will not be published. Required fields are marked *