今だけ人気マンガ100円レンタル特集♪

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

締切済

  • 質問者：fujisun
  • 質問日時：
  • 回答数：3件

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

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (3件)

No.3

  • 回答者： miory3
  • 回答日時：

ビルダーでのフレーム境界線の固定は、「フレーム設定ページの属性」でもできると思います。


それを使用するとNo.2さんの仰ったようなことがタグを打たずにできるはずです。
きちんとタグ打ちできる方が、本当はいいのでしょうけれどね。
    • good
    • 0
    • 件
通報する

No.2

  • 回答者： NymphLuna
  • 回答日時：

「プルダウンメニュー（レイアウト枠）を下のフレームに表示する方法」につきましては


No.1さんのご意見にありましたように、タグを明記していただかないことには
問題点が不明なためアドバイスできません。

> フレーム境界線を上に上げていくと、プルダウンメニューが下のフレームに隠れてしまいます。
これに関してはフレームを上にあげられないように「固定」してしまうのが一番だと思います。
フレームのHTMLタグは下記のようにされると良いと思います。

<html>
<head>
<title></title>
</head>
<frameset rows="15%,*" border="1" frameborder="1" framespacing="1">
<frame name="ue" src="menu.html" noresize scrolling="NO">
<frame name="shita" src="top.html">
<noframes>
<body>
<p>フレーム未対応用コメント</p>
</body>
</noframes>
</frameset>
</html>

※「rows="15%,*"」「name=」「src=」につきましては任意で変更してください。

この回答への補足

回答ありがとうございます。質問のプルダウンメニューは右側に▼があるメニューではなくで、IBMのトップページ
(http://www.ibm.com/jp/）のようなメニュー（階層メニューと呼ぶのでしょうか？）を指したつもりでしたが、うまく皆さんに伝わっていなかったようです。ホームページビルダーで、上下分割フレームの上のフレームに、右側に▼があるメニュー（オプションメニュー）を配置すると下のフレームの隠れることなく下のフレームに表示されることは確認できました。ホームページビルダーで上下分割フレームの上のフレームに作成したメニュー（IBMのトップページのようなメニュー）を下のフレームに表示する方法を教えて頂きたいと思います。いろいろご迷惑をかけましたが、よろしくお願いします。

補足日時：2008/01/10 19:40
通報する
    • good
    • 0
    • 件
通報する

No.1

  • 回答者： aprilia-rs
  • 回答日時：

記述したタグを公開して頂かなければ問題点を解決出来ません。


ちなみに今、上フレームのプルダウンメニューを作ってみましたが、下フレームにもちゃんとまたいで表示出来ました。

この回答への補足

早速の回答ありがとうございます。
説明不足でしたので、再度お願いします。ホームページビルダーでプルダウンメニューを作成しました。このページを上下２分割フレームにすると、上のフレーム内にプルダウンメニューが配置されます。プレビューすると当然プルダウンメニューは上のフレームに表示されます。上のフレーム内に配置されているプルダウンメニューを下のフレームに表示する方法をホームページビルダーのソフトを利用して作成していることを前提に、教えていただきたいと思います。よろしくお願いします。
（・最初の質問の「フレーム境界線を上に上げていくと、プルダウンメニューが下のフレームに隠れてしまいます。」の文章は分かり難かったので削除させていただきたいと思います。
　・「タグを公開して頂かなければ問題点を解決出来ません。」とのことですが、HTMLについての知識はほとんどありません。HTMLソースを見ると長く、どの部分を公開したらよいのか分からないので公開できませんが、よろしくお願いします。）

補足日時：2008/01/08 19:49
通報する
    • good
    • 0
    • 件
通報する

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

このQ&Aを見た人はこんなQ&Aも見ています

関連するQ&A

関連するカテゴリからQ&Aを探す

専門家回答数ランキング

専門家

※過去一週間分の回答数ランキングです。

Q質問する（無料）

他の専門家の回答をチェック

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

QHTMLページ上でiframeを最前面に出したい。

Javaを使用せずにHTMLページ上に埋め込んだiframeを最前面に出す方法はないでしょうか？

ヤフーショップページの左側にあるサイドナビ内のフリースペース枠にiframeでカテゴリーを埋め込んでいます。

その際にiframe枠内ではアコーディオン系のマウスオーバーにてサブメニューが右側に表示されるような感じの事を行っていますが、トリプルサービスでのトップページでは表示になんら問題はないものの、ヤフーショッピングサイトではHTMLタグの制限で外部CSS及びJavaが使用できず何とかならないものかと色々試行錯誤するものの解決の糸口が見当たりません（汗

z-indexをiframeタグに加えてみたもの効かず、overflow:visible;でも効かず、ダメもとでsrc=""のファイル名直後に?wmode=transparentを書き加えてももちろんダメでした（汗

Youtubeの時に?wmode=transparentが有効だったのでもしかして！？と思ったのですが。。。

ヤフーショッピングにてサイドナビ内に設置したいカテゴリが商品量に相応し縦長になり、更にはサイドカテゴリ部より直接商品ページへ飛ばしたいと考えており益々長くなってしまいバランスが悪いのでアコーディオン形のものが埋められればと試行錯誤しております。

他に表示的なアドバイスを含め、何か策があればご教授をお願いします m( . . )m

Javaを使用せずにHTMLページ上に埋め込んだiframeを最前面に出す方法はないでしょうか？

ヤフーショップページの左側にあるサイドナビ内のフリースペース枠にiframeでカテゴリーを埋め込んでいます。

その際にiframe枠内ではアコーディオン系のマウスオーバーにてサブメニューが右側に表示されるような感じの事を行っていますが、トリプルサービスでのトップページでは表示になんら問題はないものの、ヤフーショッピングサイトではHTMLタグの制限で外部CSS及びJavaが使用できず何とかならないものかと色々試行錯...続きを読む

Aベストアンサー

要素のスタイルに z-index だけでなく、position: relative も加えてください。

要素に z-index を適用する場合、その要素の position が static 以外の値でないといけません：
つまり relative, absolute, fixed のどれかです。
position: relative を指定し top, right, bottom, left の値を指定しなければ（デフォルト値の auto にしておけば）、要素の位置はそのままに z-index で重なり順を制御できるはずです。
この手法で表示崩れを生じる場合は他のスタイルとの干渉が考えられます。


表示に関するアドバイス、余計なお世話かもしれませんが加えます。
『縦長になってバランスが悪いので』といった理由で JavaScript を用いたアコーディオン型メニューを加えているなら、それはきっとやめたほうがよいでしょう。
JavaScript がオフの環境は考慮されているかという問題以前に、バランスの悪くなるほど縦長のメニューは折り畳んだところで使い勝手は悪いままの場合がほとんどです。

なぜ縦長のメニューになるのでしょう。
カテゴリを細かく分類しすぎなのか。
それとも最下層のカテゴリまで一度に表示しようとしているのですか。
考慮の浅い分類は、表示の工夫以前にそもそも使いづらい運命です。

ぱっと見で収まるくらいの分類数に収めるよう考え直してみてはどうでしょう。
分類しづらい、あまりにかけ離れた商品種を扱っているなら、それは別のショップとしてサイトを作るべきです。
細かな分類は、大きな分類を選んだあとに表示するべきです。
数十の分類から一つを探し出すより、数個の分類を複数回渡り歩くほうがユーザーにストレスはかからないそうです（一回のクリックまでが短ければ、複数回クリックは苦にならない）。
細かな分類まで最初に見せたい理由が、その中に人気の商品があるなどであるなら、それは別枠の分類『人気の商品』『新商品』などとしてリンクを設けるべきで、わらの中から針を探すという苦行をユーザーにさせるべきではありません。

あとただの偏見ですが、マウスオーバーで出てくるサブメニューは使い勝手の悪い印象があるので、よほど洗練された使い方でない限りそれがあるだけでサイトの評価減です。

提供側の『このように見せたい』ではなく、利用側の『このように見たい』が優先される世界を願って。
（Amazon などは『このように見たい』の中にさりげなく彼らの売りたいものを混ぜてくるので、さすがだと思っています）

参考URL：http://webdesignrecipes.com/css-visual-formating-model/

要素のスタイルに z-index だけでなく、position: relative も加えてください。

要素に z-index を適用する場合、その要素の position が static 以外の値でないといけません：
つまり relative, absolute, fixed のどれかです。
position: relative を指定し top, right, bottom, left の値を指定しなければ（デフォルト値の auto にしておけば）、要素の位置はそのままに z-index で重なり順を制御できるはずです。
この手法で表示崩れを生じる場合は他のスタイルとの干渉が考えられます。


表示に関するアド...続きを読む

他の回答も見る

Qフレームを跨ぐドロップダウンメニューの方法

フレームを跨いでドロップダウンメニューを表示するにはどうすればよいのでしょうか。

フレームで上下に分割し、上のフレームにjqueryを利用したドロップダウンメニューを使いたいのですが、下のフレームに差し掛かると切れてしまいます。ドロップダウンメニューは以下のものです。
http://onehackoranother.com/projects/jquery/droppy/

フレーム自体が既に主流ではないのは承知なのですが、使わざるを得ない事情がありまして・・・。
色々検索しても出てこず、大変困っております。
ｚ-indexを指定したりしてみましたが解決しませんでした。
どなたかお教えいただけますと幸いです。

Aベストアンサー

書き忘れましたので、連投失礼します。

z-indexを指定しても効果がないのは、当然です。
z-indexは、そのHTMLファイル内での重なり順を指定するものです。

フレーム分割をする場合、フレームを定義するHTMLファイルと、
各フレーム内に表示されるHTMLは別ですので、
後者内でz-indexを指定しても、前者の定義を書き換えられません。

以上のことから分かる通り、
インラインフレームを使用すれば解消できますが、

フレームを使わざるを得ないとのことなので、不可能です。

他の回答も見る

Q上下フレーム分割ページでプルダウンメニューはできますか？

こんにちは。
いつもお世話になっております。

HPのコンテンツが増えてきたので、スタイルシートを
使って、プルダウンメニューにしたのですが・・・。

ちょっと、メニューの項目名を変えたい、と思った
時に、全部のページを変更してまわるのは、手間だなぁ
と思って、上下でフレーム分割をして、上に
プルダウンメニュー、したに、それぞれのページが
来るようにしたいのです。

ためしにやってみたのですが、プルダウンがしたの
ページで隠れてしまう上に、
タイムエラーが出ました。　デバッグして下さい
というエラーメッセージが出てします。

上下フレーム分割ページでプルダウンメニューはできない
のでしょうか・・・？

どうかご指導よろしくお願いいたします。

Aベストアンサー

こんにちは。No.1のものです。

プルダウンメニューを表示した時に下のフレームに
隠れてしまうとの事ですね？
確かにそうですね。すみません。
今のところ、両方とも子フレームなので、親子関係を
作ってあげたら出来るかもしれません…。

とりあえず抵抗がなければインラインフレームを
使うのが一番簡単だと思います。

前のindex.htmlを使うのをやめて、
code_top.htmlを変更します。

code_top.html---------------------------------
<iframe src="code_blank.html" name="contents" width="100%" height="95%" frameborder="0" noresize style="margin-top:60px; border-style:solid; border-width:1px; border-color:#888888;">
</iframe>
</body>
</html>
-----------------------------------------------
最後のbodyの閉じタグの直前に
上記<iframe>～</iframe>を追加してください。
トップページはcode_top.htmlとなります。

レイアウトはどのようにしているのかは
分かりませんが、とりあえず上に詰めても
かぶらないと思います。
適宜修正お願いします。

ではでは。

こんにちは。No.1のものです。

プルダウンメニューを表示した時に下のフレームに
隠れてしまうとの事ですね？
確かにそうですね。すみません。
今のところ、両方とも子フレームなので、親子関係を
作ってあげたら出来るかもしれません…。

とりあえず抵抗がなければインラインフレームを
使うのが一番簡単だと思います。

前のindex.htmlを使うのをやめて、
code_top.htmlを変更します。

code_top.html---------------------------------
<iframe src="code_blank.html" name="contents" width="...続きを読む

他の回答も見る

Qプルダウンメニューでインラインフレームを・・・

インラインフレームの内容（ファイル）を、プルダウンメニューで選択して変更できるようにしたいのですが、どういう風にスクリプトを書けばいいのでしょうか？　「プルダウンメニューで画像を変える」スクリプトは見つけたのですが・・・・・・。

Aベストアンサー

ちょっと作ってみました。

<html>
<head>
<title></title>
<script type="text/javascript"><!--
function ifrm_change(){
window.open(document.f1.sl1.value,"ifrm1");
}
//--></script>
</head>
<body>

<iframe name="ifrm1" src="a.html" width="400" height="300"></iframe>

<form name="f1">
<p>
<select name="sl1" onChange="ifrm_change()">
<option value="./a.html">a</option>
<option value="./b.html">b</option>
<option value="./c.html">c</option>
<option value="./d.html">d</option>
<option value="./e.html">e</option>
</select>
</form>

</body>
</html>

プルダウンメニューを変更すると、optionのvalueに入れてある値を参照先URLとして、インラインフレームのifrm1にそのファイルを読み出すようにしてあります。
このソースでは、インラインフレームに付けた名前をターゲットにして、window.openでファイルを呼び出すようにしてあります。
こんな感じでしょうか。

参考になれば。

ちょっと作ってみました。

<html>
<head>
<title></title>
<script type="text/javascript"><!--
function ifrm_change(){
window.open(document.f1.sl1.value,"ifrm1");
}
//--></script>
</head>
<body>

<iframe name="ifrm1" src="a.html" width="400" height="300"></iframe>

<form name="f1">
<p>
<select name="sl1" onChange="ifrm_change()">
<option value="./a.html">a</option>
<option value="./b.html">b</option>
<option value="./c.html">c</option>
<option value...続きを読む

他の回答も見る

Qプルダウンメニューが隠れてしまいます

indexページにFlashで制作したswf形式のムービーを配置しました。
ところが
ヘッダに配置してたメニューからJavaScriptでプルダウン表示されるメニューと
ムービーが重なる部分がレイヤーのような状態となり
プルダウンメニューがムービーの背面へ隠れてしまい
メニューの機能が失われてしまいました

・swfはhtmlに直接配置して表示
・プルダウンのメニューは外部に置いたjsファイルを読み込んで表示
・メニューも外部JavaScriptからの読み込み

以上の仕様なのですが問題点はswfの配置方法でしょうか？
それともJavaScriptのレイヤーに問題があるのでしょうか？

アドバイスをお願い致します

Aベストアンサー

問題点は，ブラウザの仕様です。
また Flash だけで起こる問題でもありません。
enbed や object で貼り付けるたぐいの動画などもそうなります。
そういうたぐいのものの上には何も表示できません。

OS が Windows で， ブラウザも IE と他少々に限定すれば，
SWF を貼り付けるタグを，
背景透明 か 背景不透明 にすると，
プルダウンメニューは隠れずに表示されます。
wmode="transparent"
とか
wmode="opaque"
とかです。

しかし，Mac 環境や，Win+Firefox などでは，
そもそもそのタグ自体を受けつけないので，
その方法も使えません。

この件に関しましては私も何度も回答していて，
どれが良いかわからなくなっていまいましたが，
とりあえず次のURLのものでも参考にしてみてください。

「swfファイルとHTMLを重ねる」
http://oshiete1.goo.ne.jp/qa1620013.html
　　↑教えて！goo　　↓OKWave　（同じです）
http://okwave.jp/qa1620013.html



Adobe のサイトも一時期 SWF の上にプルダウンが重なるようになっていましたが，
そのときはブラウザによって出すページを振り分けていましたよ。
Win+IE なら Flash + JavaScriptのプルダウンのページを表示
Mac なら JPEG + JavaScriptのプルダウンのページを表示
のように。

面倒なので，
最初から Flash の上にプルダウンメニューを作らない人の方が多いと思います。

問題点は，ブラウザの仕様です。
また Flash だけで起こる問題でもありません。
enbed や object で貼り付けるたぐいの動画などもそうなります。
そういうたぐいのものの上には何も表示できません。

OS が Windows で， ブラウザも IE と他少々に限定すれば，
SWF を貼り付けるタグを，
背景透明 か 背景不透明 にすると，
プルダウンメニューは隠れずに表示されます。
wmode="transparent"
とか
wmode="opaque"
とかです。

しかし，Mac 環境や，Win+Firefox などでは，
そもそもそのタグ自体を...続きを読む

他の回答も見る

Qframeset要素を使わずに画面を分割したい

アンテナ（下記サイト）のように左にメニュー画面を、右にコンテンツを表示するホームページを作成したいと考えています。
https://antenna.jp/

ひとつのウインドウで画面を2つにわけるためにはhtmlのframeset要素を使えばできることは把握しているのですが、上記サイトのアンテナではframesetを使わずに画面分割をしています。

見た目やレスポンシブ対応のしやすさも考え、できればframesetを使わずに画面分割を行いたいのですが、どのようにすれば可能でしょうか。
メニュー部分とコンテンツ部分を別々にスクロールできるようにしたいです。

どなたか分かる方教えてください。

Aベストアンサー

長くなるから、参考ページ参照。

参考URL：http://www.geocities.jp/eijispace/2012/0419.html

他の回答も見る

Qホームページビルダーでプルダウンメニュー作成

質問させていただきます。HP作成中です。素材サイトにあるようなプルダウンメニューを作成したいのですがどのような方法で作成するのでしょうか？こちらのサイトです。http://www.s-chimp.com/mc/
メニューをクリックするとサブメニューが表示されます。理想としては違うメニューをクリックしたときに他のサブメニューが表示されたままではなく閉じると嬉しいです。初心者なので難しいことは出来ないと思うのですがどなたかお願いいたします。

Aベストアンサー

ホームページビルダーの機能にはありませんので
こちらの　メニュー　か　個人的に使ってみたいスクリプト　を参考にしてください

http://www.wsb.jp/hpb/java_s/top.htm

他の回答も見る

Q【プルダウンメニュー】フレームの中のインラインフレームに、ターゲットを指定するには？

現状は【フレームA（ヘッダー1）】【フレームB（ヘッダー2）】【フレームC（メイン）】【フレームD（フッター）】の4分割のうえに、更にフレームCの中に【インラインフレーム】があります。

フレーム3の中にプルダウンメニューを設置し、インラインフレームに表示させたいのですが上手く動作しません。

※ちなみに、「var target = "フレームA名";」で試してみると動作はするのですが…。
という事は「フレームの中のインラインフレーム」という点がネックなのでしょうか？

とあるソースを改良して使おうと思ったのですが、javascript素人につき行き詰まっています。どなたか回答いただけると嬉しいです。


<SCRIPT TYPE="text/javascript">
<!--

var target = "インラインフレーム名";

function jump(){
var url = document.form1.select.options[document.form1.select.selectedIndex].value;
if(url != "" ){
if(target == 'top'){
top.location.href = url;
}
else if(target == 'blank'){
window.open(url, 'window_name');
}
else if(target != ""){
eval('parent.' + target + '.location.href = url');
}
else{
location.href = url;
}

}

}

// -->
</SCRIPT>


<FORM NAME="form1">
<SELECT NAME="select" onChange="jump()">
<option value="">お選びください
<option value="Ahtml/arr">AAA
<option value="B.html">BBB
<option value="C.html">CCC
<option value="D.html">DDD
<option value="E.html">EEE

</SELECT>
</FORM>

現状は【フレームA（ヘッダー1）】【フレームB（ヘッダー2）】【フレームC（メイン）】【フレームD（フッター）】の4分割のうえに、更にフレームCの中に【インラインフレーム】があります。

フレーム3の中にプルダウンメニューを設置し、インラインフレームに表示させたいのですが上手く動作しません。

※ちなみに、「var target = "フレームA名";」で試してみると動作はするのですが…。
という事は「フレームの中のインラインフレーム」という点がネックなのでしょうか？

とあるソースを改良して使おう...続きを読む

Aベストアンサー

- - arrival.html - -

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head><title>Untitled</title>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<script type="text/javascript">
function jump(){
var url=document.form1.select1.options[form1.select1.selectedIndex].value;
if (url!="") document.arr.location.href = url;
}
</script>
</head>
<body>
<iframe name="arr"></iframe>
<FORM NAME="form1">
<SELECT NAME="select1" onChange="jump()">
<option value="">お選びください
<option value="aaa.html">AAA
<option value="bbb.html">BBB
</SELECT>
</FORM>
</body>
</html>

- - arrival.html - -

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head><title>Untitled</title>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<script type="text/javascript">
function jump(){
var url=document.form1.select1.options[form1.select1.selectedIndex].value;
if (url!="") document.arr.location.href = url;
}
</script>
</head>
<body>
<if...続きを読む

他の回答も見る

Qプルダウンメニューの開く方向をコントロールしたいのですが

はじめまして、flyingmanと申します。いつも皆なさんの質問・回答で勉強させていただいて大変感謝しております。

さて今回、年・月・日・時を選択するために４つのプルダウンメニューをselectタグを使い作成したのですが、日指定のプルダウンメニューだけが、上方向に開いてしまいほかの3つのメニューと開く方向をそろえたいと色々調べておりますがなかなかいい方法が見つからないしだいです。
selectタグへのスタイル指定でそのようなことができるかどうか教えていただけないでしょうか？

環境
OS：WindowsXP SP2
ブラウザ：Internet　Explorer　Ver6.0　のみ

プルダウンメニューの開く方向は、プルダウンメニューの位置と開くメニューの高さで自動に決まってしまうのだろうとは思うのですが、位置をずらさずに開く方向だけを変更できる方法をご存知でしたら教えてください。
よろしくお願いいたします。

Aベストアンサー

#1補足＞
補足ありがとうございました。
状況は確認できましたが、やはり、そのような指定をする設定はないようです。

他の回答も見る

QCSSプルダウンメニューとjQueryの重なりについて

CSSプルダウンメニューとjQueryの重なりについて

下記サイト
http://www.karuizawanet.com/cgi-bin/database/database.cgi?cmd=s&sc=hotel

にてCSSプルダウンメニューと

Simple jQuery Spy Effect（要素の自動スクロール）
http://f32.aaa.livedoor.jp/~azusa/index.php?t=ajax&p=jquery_plugin_scroll

を設置していますが、

CSSプルダウンメニューが
要素の自動スクロールの下に隠れてしまい
困っています。

CSSのz-indexを入れてみましたが、改善されません。

どなたかお力添えをお願いいたします。

Aベストアンサー

cssでul.menu ulを下記の通り書き換え。

position:relative;
↓
position:absolute;

以下追加。
z-index:2;

他の回答も見る
ページトップページトップ

Q質問する（無料）

このQ&Aを見た人がよく見るQ&A

人気Q&Aランキング

おすすめ情報