タグ

2011年12月3日のブックマーク (1件)

  • jQueryで簡単タブメニューを自作する | 1:n – DETELU Blog

    WordPress 3.2.1がリリースされてますね。3.2からIE6非対応とのことなのでまだインストールすらしてませんが、そのうち試そう。 今日はスマホで活躍の場がありそうなタブメニューをjQueryで作成してみます。 スマホ対応ページを作成する場合、PCページをそのまま移植しようとするとやたらにページが長くなってしまう場合があります。そんなときはタブメニューを使って、ちょちょいとコンテンツをまとめてみましょう。 jQueryで簡単タブメニュー サンプル まずは簡単にHTMLから説明。HTML側にはjQueryで処理しやすいように、タブとコンテンツにidを割り当てます。idは処理しやすくするため「tab_1」「content_1」と文字と数字のセパレータに「_」を入れ、数字が同じものが対になるように割り当てています。 <div class="tabarea"> <ul class="ta