IT.pdf IT-s.pdf 記事一覧 |
タブメニュー1 [2] |
記事一覧のファイルでメニューをタブで表示しようとして作り方を調べました.タブで変わる部分に他の HTML ファイルを埋め込んでいると思っていて,フレーム無しでどのように実現しているのか興味があったのですが,[1] 等で説明されているタブメニューの作り方を拝見してそうではないことを知りました.HTML ファイルを埋め込もうとすると汎用のタグ <object> を使うしかないのでしょうがあまり普及していないようです [5],[6].試みに [7],[8] の二つの index.html のソースを眺めました.いずれも <div id="vs_wrapper"> 内に <div id="vs_header"> と <div id="vs_main"> があり,タブごとに独立したファイルを設けていることを確認できました(<>は半角と思ってください).
※ ファイルの分割は気が進まないので記事一覧のファイルのタブメニュー化は止めます.
両者の <div id="vs_header"> 部は完全には一致していませんが,タブは他にもあり個別に更新するとは考えにくく,index.html の本当のソースは XML ファイルで,ヘッダー部分をインポート/インクルードして XSLT で変換しているようです.XML について全然知識がありませんので,これを機会に少し Web 上の資料を眺めて備忘録を書きます.
[1] ホームページ作成 タブメニューのいろいろ(一覧) - WEBサイト作成 フリー ...
http://www.1uphp.com/con2/menu/tabmenu1.html
[2] タブメニューのいろいろ(一覧)> タブメニューの作り方(1)
http://www.1uphp.com/con2/menu/tab11.html
4.リストの各項目を、回り込ませて並べる
[3] HTML と CSS のみでタブを作るサンプル | ウェブル
http://weble.org/2011/05/24/html-css-tab
[4] タブ切替をサクッと実装 - Archiva
http://archiva.jp/web/javascript/tab-menu.html
[5] <object> - オブジェクトの張りつけ
http://www.tohoho-web.com/html/object.htm
[6] <object>・・・・・文書にデータを埋め込む
http://www.htmq.com/html/object.shtml
画像・動画・音声・各種プラグインデータ・JAVAアプレット・他のHTML文書等の、様々な形式の・・・
ブラウザ側の対応が完全ではなく、限られた状況でしか利用されていません。
[7] Vector > ショップ (> Windows)
http://shop.vector.co.jp/service/index.html
ソースコードの方も見てください.
[8] Vector > ショップ > Mac
http://shop.vector.co.jp/service/mac/index.html
ソースコードの方も見てください.
[9] XSL Transformations - Wikipedia
http://ja.wikipedia.org/wiki/XSL_Transformations
別のXML・・・(XSL-FO、HTML、RTF、TeX文書など)の文書を生成することができる。
[10] XSLT (XSL Transformations) スタイルシート
http://itref.fc2web.com/xml/xslt.html
xsl:output 変換結果の出力方法を指定します。
[11] @IT:XMLテクニック集 - 外部のXML Schemaをインクルード/インポート ...
http://www.atmarkit.co.jp/fxml/tecs/030xsd/30.html
[12] たのしいXML: Schema(スキーマ): import
http://www6.airnet.ne.jp/manyo/xml/schema/step39.html
[13] たのしいXML: Schema(スキーマ): include
http://www6.airnet.ne.jp/manyo/xml/schema/step40.html