上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

前回の「フレーム(frame)の使用について」で述べたように、今回は擬似フレームについて。

擬似フレームとは、フレームの最もよい点である「その他のフレームに無関係にスクロール」をさせつつ、「フレーム内の個別のページの URL はブラウザに表示されない」という問題を解決するものです。

使用するものは、CSSとJavascriptです。


今回の実装にあたり、「疑似フレーム」の作り方(IE6 にも対応、スタイルシート(CSS)、JavaScript使用)のモジュールを一部使用させていただきました。

とりあえず、実際に動作しているサンプルページはこちらです。
上記はフレームを使用せず、index.htmlという1つのhtmlファイルでCSSJavaScriptを用い擬似フレームを実装しています。


解説については上記本家本元である「疑似フレーム」の作り方(IE6 にも対応、スタイルシート(CSS)、JavaScript使用)が詳しいので、そちらも参考にしてください。

フッター部分の出力、メニューの切り替え、印刷ページなどは独自仕様です。
詳細については後日追記します
Related Posts

Thoughts on スポンサーサイト擬似フレーム

says... タイトルが変わりました

Date:2006/11/24 19:03

 ご引用いただきましたページを作らせていただいたものです。
 どうもありがとうございます。ご利用を歓迎しております。

 ただいま、そのページのタイトルを変更いたしましたので、ご連絡を差し上げます。

IE6 対応「疑似フレーム」の作り方(スタイルシート、JavaScript使用)
     ↓
「疑似フレーム」の作り方(IE6 にも対応、スタイルシート(CSS)、JavaScript使用)

 変更した理由は以下の通りです。
● IE6 以外にも多くのブラウザに対応している。
● 「疑似フレーム」を先頭にもってきたほうが、それについて知りたい人の関心を強く惹きつけやすい。

 なお、「疑似フレーム」を括弧付きで表現しているのは、この用語が適切なのか否かについて若干の疑問を抱いているからです。とはいうものの、もっとも普及している用語ですので、括弧で来るんだ状態ではあるものの使用しております。

 こちらのサイトは役立つ情報がたくさん載っているので、時々見ております。これからも利用させていただきますので、どうぞよろしくお願いいたします。

says... コメントありがとうございます

Date:2006/11/25 01:26

タイトルの変更のご連絡、ありがとうございました。
反映いたしました。

私の方でも「擬似フレーム」をもう少し改良して実装できるよう、こまごまとやっております。

特に、
・印刷がおかしくなるという致命的な部分の改善
・擬似であれ「フレーム」なので、メニュー部分のサイズ変更(少なくとも表示・非表示の切り替え)
という対応がいるかなぁ、と考えています。

says... 印刷・メニューサイズ変更に対応しました

Date:2006/11/28 01:54

 お返事ありがとうございます。
 印刷の件は、全く考えておりませんでしたので、教えていただきまして大変助かりました。印刷用CSSファイルを用意することで対応しました。
 また、メニューの折り畳みは、面倒そうだけどいずれしないといけないと思っておりましたので、思い切って対応しました。
 こんな感じです。
http://www.kuhp.kyoto-u.ac.jp/~diag_rad/web/p_frame.html

 と思ったら、こんなすばらしいページが、、、
http://blog70.fc2.com/k/komitsudo/file/frame.html

 これからもこちらのサイトからは目が離せません。

Leave a Reply

* less than 16 characters
* less than 24 characters
* less than 16 characters
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。