• 締切済み

frameをはみ出した領域を表示させたい

メニューバーとメインフレームの上下２分割で<frame>で切っていて、 上のメニューバーの要素に触れるとサブメニューがポコッと飛び出す作りにしたのですが、飛び出した要素が下のフレームの下に隠れてしまいます。 CSSの話になってしまうのですが、 overflow:visibleや、position:absoluteを指定してもダメでした。 どなたか対策をご存知でしたら宜しくお願い致します。 ブラウザはIE8です。

  • HTML
  • 回答数2
  • ありがとう数0

みんなの回答

  • neko-ten
  • ベストアンサー率55% (1287/2335)
回答No.2

要素として各フレームが完結してますので、難しいですね。 下のフレームに隠れているわけではなく、上フレームの表示領域外に表示されてるわけです。 方法としては、ぽこっと飛び出すメニューをメニュー配置するのではなくメインフレームに配置する方法 http://miyakekobo.fc2web.com/temp/total002.html ただ、飛び出すメニューはすべてのページに記載必要です。 フレーム使わずに、JavaScript記述などで代替は難しいですかね・・・。 XMLにメニュー要素を記載、JavaScriptでパースして表示・・・ といった感じなら、メニューの一括変更も楽じゃないかな・・・？

noname#130843
noname#130843
回答No.1

そもそも、frameを使わなかったら良いと思いますが。。 一枚のhtmlに出来ない理由はあるんですか？ ページ数が多くて修正が大変なのでしょうか？

urahyster
質問者

補足

おっしゃる通りページ数が多くて修正が大変なのと、 仕事での要件的にどうしてもフレームを使わなければならないのです。 やはりCSSやHTMLでは無理なのでしょうか？

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. HTML

関連するQ&A

  • 疑似フレームがIEだと成り立たない

    疑似フレームがIEだと成り立たない 以下のようなCSSですが、FIREFOXやクローム等では反応するのですが、 IEだと処理されません。 どうすればいいのでしょうか？ 教えてください。お願いします。 ちなみにCSSというものは初心者です。申し訳ありません。 <STYLE> <!-- BODY .menu1 { width : 12%; height : 100%; left : 0px; top : 100px; position : fixed; overflow: auto; } .menu2 { width : 12%; height : 100%; right : 0px; top : 100px; position : fixed; overflow: auto; } .main { position : absolute; z-index : 1; } --> </STYLE>

  • 「position:absolute」のIEのバグへの対処方法

    CSS #navbar { position: absolute; z-index: 1 } HTML <div id="navbar"> 略 </div> <div id="contents"> 略 </div> CSSとJavascriptを使って、プルダウンメニューを作ったのですが、IE7でうまく動かない為ネット検索したところ、CSSの「position:absolute;」に対して、「"absoluteした要素が消える"というIEのバグ?」の記事に出会いました。 このため「position:relative;」としてみたのですが．． メニューの下のコンテンツがプルダウンメニューのプルダウンされる大きさの分だけ下に下がって空間が空いてしまい、メニューバーの下にコンテンツがすぐ在ってその上にプルダウンするメニューが重なる、という表示ができなくなってしまいました。 なにかよい方法はありますでしょうか。

    • ベストアンサー
    • HTML
  • フレームの仕様について

    例えば <frameset rows="○○px,100%"> <frame src="○○" scrolling="no" noresize frameborder="no" name="head"> <frame src="○○" noresize frameborder="no" name="contents"> </frame>でフレームを上下で分割した時に、上のフレームでは上下左右のスクロールバーが出ない設定にしてあるのですが、下のフレームではスクロールバーが表示される様に設定してあります。この時に、下のフレームで上下のスクロールバーだけを表示させたいと思っているので左右のスクロールバーを表示させたくありません。どうすればよろしいのでしょうか。

    • ベストアンサー
    • HTML
  • CSSのスタイルシートについて教えて下さい。

    現在、ASP.NETにてメイン画面に使用する４分割のアプリケーションを作りたいと考えているのですがWeb Developer 2005 ではframesetが使えないので代替案を模索していました。 そこでCSSのスタイルシートにて作成しているのですが、見ようみまねでサンプルを加工しても記述を見ても経験が浅い為全く分からなくて困っています。 勉強が足りず恐縮ですがご教示下さい。 ４分割フォームの詳細は ・ヘッダー部分「Title.aspx」→　両端に画像が入った題名のみのファイル ・左部分「left.aspx」→　 検索ボックスと検索ボタンが４つあり。キーを入力して 　 次の検索結果フォームへ異動する。 ・右部分「right.aspx」→　left.aspxと全く同じ作りです。 　　　　　　　　　　（東日本と西日本が分かれているようなイメージです。） ・下部　→　署名（フォームではなく文字列） <BODY> <HEAD> <link rel="stylesheet" type="text/css" href="pseudoframe_lmr.css"> </HEAD> <DIV class="menu"> メニュー </DIV> <DIV class="bar"> タイトル </DIV> <DIV class="main"> メインコンテンツ </DIV> <DIV class="bar2"> <p align="right">Copyrigth &copy 2006-2007 Name all rights Reserved</p> </DIV> </BODY> <STYLE> /* Opera/mozilla/共通用CSS */ <!-- BODY{ background-color : #e0fef8; } .menu{ width : 50%; top : 15%; left : 50px; top : 15%; position : absolute; background-color : #e0fef8; z-index : 1; } .bar{ width : 100%; height : 15%; left : 0px; top : 0px; position : fixed; overflow: auto; z-index : 2; } .main{ width : 50%; top : 15%; left : 20%; position : absolute; background-color : #e0fef8; z-index : 1; } .bar2{ width : 100%; height : 15%; left : 0px; top : 85%; position : fixed; overflow: auto; z-index : 2; } --> </STYLE> <!--[if gte IE 5 ]> /* IE5以上に適用させるCSS */ <STYLE> BODY{ width : 100%; margin : 0px; overflow : hidden; padding : 0px; } .menu{ position : absolute ! important; } .bar{ position : absolute ! important; } .main{ height : 70%; overflow: auto; } .bar2{ position : absolute ! important; } </STYLE> <![endif]--> コードを載せましたのでどの様に記述すればよいのかご教示下さいませ。 皆様、宜しくお願い致します。

  • フレームのランダム選択方法

    ご質問させていただきます。 例えば、上下2分割になっていて、上のフレームがメニュー用のフレーム、 下のフレームが更に4分割だとして、メニュー（例えばBBS）をクリックすると、 下フレームのどれかに、クリックするたびに画面が表示されるようにしたいと思っています。 何かよい方法はございませんでしょうか？ おわかりになるようでしたら、ご回答お願いいたします。

  • フレームの幅を変更したい

    左にメニュー、右にメインと２つのフレームに分かれた ページを作成しています。フレーム幅は可変になっています。 メニューの1つをクリックすると右のメインフレームは切り替わらず 左のメニューのフレームが切り替わり、１つ下層のサブメニューを表示させています。 メインメニューからサブメニューにジャンプしたとき、 左フレームの幅を自動的に広げたいのですが、方法はあるでしょうか。 それとも全体のフレームセットを切り替えるしかないでしょうか。 よろしくお願いします。

    • ベストアンサー
    • HTML
  • フレーム分割したページの表示で困っています。

    ホームページビルダー９でホームページを作成しています。 ページを上下に２分割して上のフレームにリンクメニューを、下のフレームにメニューのリンク先を表示するように作りました。 自分のデスクトップパソコンでは問題なく表示されているのですが、試しにＢ５サイズのノートパソコンで表示してみると、画面全体が表示されず、上のページのメニューボタンを表示しているところが下のフレームページで隠れてしまっているのです。 下フレームは属性で自動的にスクロールバーが出るように設定しているので問題ないのですが、上のメニューは「なし」に設定しています。 ※デザイン上、表示させたくないので。 ここからが質問です。 ページを表示させた時に、ページ全体のサイズを変えても上のメニューのフレームページが常に下のフレームページの上に来るように、つまり、上のメニューページのサイズは変わらないように固定させる方法（！？）を教えて下さい。 説明がへたで申し訳ないのですが、どうぞ宜しくお願いします。

  • メインフレームの中に入れ子でフレームページ

    メニューをクリックするとメインフレームの中に、更にフレームのページを入れるような場合、 最初のメインメニューでクリックした時は、中に入れ子のように上手く表示されてるのですが その入れ子の中のフレームの左のメニューをクリックすると 二つメインフレームが存在してしまうせいか、入れ子の中のメインではなく TOPのメインフレームに覆いかぶさるように用事されてしまい 入れ子の中のメニューが無くなってしまい困っています。 ※入れ子の中でparentのように表示されてしまいます。 TOPのフレーム(右メインメニューフレームとメインフレーム)表示も残しつつ、 入れ子の中の（右サブメニューとメインフレーム）表示も残すのはどうしたらできるのでしょうか？ 教えてくださいm(__)m

  • 上のフレーム内のプルダウンメニューが下のフレームに隠れてしまい、困っています

    ホームページビルダーでホームページを作成しています。上下分割フレームの上のフレームで作成してあるプルダウンメニュー（レイアウト枠）を下のフレームに表示する方法を教えてください。フレーム境界線を上に上げていくと、プルダウンメニューが下のフレームに隠れてしまいます。よろしくお願いします。

  • フレームページのドロップダウンメニューの表示

    初歩的な質問で申し訳ありません。 上下に分けたフレームページの上のページにドロップダウンメニューを設置しました。 が、出てくるサブメニューが下のフレーム内のページの下に潜り込んでしまいます。 サブメニューを上に出すにはどうすればよいでしょうか？ ちなみに、下記ページを手本にして設定しようとしています。 http://www.slipknot1.com/index?refresh=true よろしくお願いいたします。

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する