左右にスライドするパネルを作る jQueryを使ってスマートフォンサイトで活用できる実用的なスクリプトを作成します。最初に作るのは、iPhoneでおなじみの「左右にスライドするパネル」です。 iPhoneの設定画面で項目を選ぶと、画面が左方向にスライドして、代わりに次の画面が右から表示されます。このとき、画面の上部には左向きの矢印ボタンが表示され、矢印ボタンをタップすると逆には右方向にスライドして元の画面に戻ります。こうしたスライドの動きによって、直感的で分かりやすいUIを実現しています。 まず、目次部分のHTMLを用意します。 <div id="index" class="iPhoneBody panel active"> <div class="iPhoneHead"> <h1>スライドパネルを作る</h1> </div> <h2 class="iPhoneListTitle">実践!
![jQueryでiPhone風スライドパネルを作ろう (2/5)](https://cdn-ak-scissors.b.st-hatena.com/image/square/37d0c6b0b12240bd526864691abea77a917e904c/height=288;version=1;width=512/https%3A%2F%2Fascii.jp%2Fimg%2F2010%2F07%2F28%2F272191%2Fl%2F490f9df46341acab.jpg)