開閉幕１３　JS+CSSでタブ切替　　　　最終修正日 : 2015/09/17

■2015/09/17：「更新履歴」のターゲット指定を target="_top" から target="_new" に修正しました。
これにより、クリック後にリンク先に飛んだ後も「初期ページ」ではなく「更新履歴」ページに戻ります。
ブラウザFirefoxのみ、 target="_top" でも target="_new" でも、「更新履歴」ページに戻ります。

TAB1 TAB2 TAB3 お知らせ 更新履歴
１ページ目の内容です。
２ページ目の内容です。
３ページ目の内容です。
お知らせ（４ページ目の内容です。）
旧URL http://atsites.jp/oekakirenn/index.html
で開設していたサイト「動くJavaScript」が、2015年5月31日をもって、突然サービス終了してしまいました。
5月11日にメールが届いていたのにこちらも気づかず、どっちにしてもデータ移行には対応できないとのこと。
あわててこちらの新サイトに移行しましたが、手作業のデータ移行のため、あちこち不具合等があるかもしれません。
なにかありましたら、お手数ですが「連絡」の方から教えていただけると助かります。
新URLは、http://oekakirenn.webcrow.jp/index.html です。
記：2015/6/6
その他■開閉幕１２超簡単タブ切替もどきと同じように、クリックで異なる内容を１つのスペースの中に呼び出すことができるJavaScriptです。
こちらは本物の「タブ切替」なので、呼び出すページごとに背景色や文字色や背景画像などの個別指定が可能です。

そしてどのタブを選択したかがわかるように、選択されたタブの下側の枠線を消し、背景色を白くしました。
実際はタブをクリック時に、タブの枠線の下側だけを黒から白に変更し、背景色も白に変更します。
この指定はCSSの「#tab a.present{ border-bottom: 1px solid #fff; background:#fff; }」でしています。
ここを「#tab a.present{ background:#f00; }」とすると、選択したタブの背景色が、薄い灰色から赤色に変化します。
自分のやりたい方法でどうぞ。

原本はArchivaの「タブ切替をサクッと実装」から。
それを前回掲載分の「その他■開閉幕１３クリックでdiv変更（削除済み）」時の参考サイトAmentiの「メニュー付き疑似インラインフレーム」を参考に、少し改造しました。
この「タブ切替」は、JavaScriptを切っている時は、全ページ表示されます。