1. ホーム
  2. > タブJSてすと

URLのハッシュ値に「#!?tab=tab_box_2」を付けると初期値をタブ2に指定

「#!?tab=tab_box_2&anchor=anchor02」にすると、アンカー移動も追加

タブ1の内容
タブ2の内容 hoge
タブ3の内容
タブ4の内容

Ajax商品一覧の埋め込み

カテゴリ商品アイテム
のコメントも入れれます。

タブの初期値指定なしは1つ目のタブが初期値

タブ1の内容
タブ2の内容
タブ3の内容
タブ4の内容

3つ目のタブが初期値 :: 初期値にしたいタブにclass="tab_on"

タブ1の内容
タブ2の内容
タブ3の内容
タブ4の内容

タブ部分がul/li無しのaタグのみ :: data-tab-selector="a"

タブ1 タブ2 タブ3 タブ4
タブ1の内容
タブ2の内容
タブ3の内容
タブ4の内容

タブの履歴を残す :: data-history="on" (※モダンブラウザのみ動作)

タブ1の内容
タブ2の内容
タブ3の内容
タブ4の内容

タブ切り替え時にアンカー移動 :: data-anchor="on"

タブ1の内容
タブ2の内容
タブ3の内容
タブ4の内容