[iphone/safari] JavascriptとCSSアニメーションでフリック操作を実装してみる 続き : nogunogu
こんにちは。のぐちです。 前回はフリック操作を判定してみるところまでを実装しました。 では、CSSアニメーションをつけてフリックに合わせて画面を動かしてみよう、 と思ったのですが、Javascriptを見直していたらちょっと時間がなくなってしまったので、 今回はスクリプトの改良のみです。 ■ クロージャを使って書き直す ■ フリック感を高める ■ ちょっとだけアニメーションっぽく 以上の改良をしてみます。 ■ クロージャを使って書き直す まず、前回「余談」と書いてしまったクロージャですが、それを利用して書きなおします。 動作そのものは変わっていませんが、クロージャを使ってグローバル変数を使わない形にしました。 <script type="text/javascript"> $(function() { var box = $("#box")[0]; var touchHandl
[iphone/safari] JavascriptとCSSアニメーションでフリック操作を実装してみる 続きの続き : nogunogu
こんにちは。のぐちです。 さて、ここまで続けて、需要があるのかどうかさっぱり分かりませんが、 今回はいよいよCSSアニメーションを使ってフリックを表現します。 早速ソースを並べて解説をしていきます。 まずは前回までのものからHTMLを少し変更しました。 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>flick</title> <meta name="viewport" content="width=device-width, maximum-scale=0.6667" /> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <link rel="stylesheet" type
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
