- ベストアンサー
インフレーム内のラベルに飛びたいのですが・・。
ＨＰの中に、インフレームを入れてるのですが、外から、リンクしてインクレーム内のラベルを貼ってる場所に飛ばしたいのですが、どうしても出来ません・・・。 どうしたら、いいでしょうか？ ちなみに、そのリンク元には、ロールオーバーをしているのです・・。（カーソルが来た時に、イメージが変わる機能）
- hcp_ryoko
- お礼率28% (2/7)
- JavaScript
- 回答数7
- ありがとう数2
- みんなの回答 （7）
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
自分自身が保持しているフレーム内の操作を行うだけなら、JavaScript は必要ありません。 単純に、 <A href="#02" target="inframe"> と書いてしまえばいいんです。 この JavaScript が必要なのは、あくまで全く無関係なページからいきなり飛んできた場合だけです。
その他の回答 (6)
補足見ました。 で、いろいろと試してみたんですが、IEでご指摘のような問題が出る事を確認しました。 補足内容のようにインラインフレーム内にpage01.htmlを読み込んである状態で、main.htmlの側のリンクからpage01.html内のラベル位置に移動するようにソースを記述しても、IEではそのリンクがうまく働かないようです。 これはおそらく、IEのバグなのではないかと思います(NetscapeやOperaで動作を確認しましたが、こちらはいずれのブラウザも狙い通りの動作をしています)。 なお、インラインフレーム内に、既に表示されているページとは別のページを、ラベル位置を指定して読み出す場合には、IEでもラベル位置に正常に移動するようです。 この異常は、ブラウザのバグのようですので、これに対する根本的な対策は難しいのではないかと思います。 一応、小手先でごまかすような方法ですが、インラインフレーム内のページのラベル位置へ飛ばすリンクのタグ内に、「onClick="if (document.all){parent.inframe.location.href=null;}"」というソースを追加すると、問題を回避できるかもしれません。 ただし、これが勧められるような手法かどうかについては自信がありません。 あまり参考にならないかもしれませんが…失礼しました。
お礼
ぺこ <(＿ ＿)>
補足
回答ありがとうございます。 いろいろ、試してみてくれたんですね・・・。 ありがとうございます。ぺこ <(＿ ＿)> 私もいろいろしたんですけど、どの方法でもムリだったんですよ・・・。 ＩＥでの動作が出来ないのですね・・・。 ↑のソースを追加してみたのですが、一回押すとエラー表示のhtmlが表示されて、そのまま二回目押すと指定したラベルへ飛べました・・。しかし、エラー表示が出てきてしまうので・・・。 ラベルで区切るのではなく、１ページづつ分けようと思います・・。 いろいろ調べてくださってありがとうございます・・。 ぺこ <(＿ ＿)>
具体的には、スクリプトエラーが出るんでしょうか？ それとも全く動かないのでしょうか？ あるいは意図しない内容が表示されてしまうんでしょうか。 仮に意図しない内容が表示されるとすれば、具体的にどんなページが表示されるのでしょうか。 それによって対処の仕方も変わってきますので、その辺を補足してみてください。
補足
エラーは出てないみたいなんですけど、ラベルへリンクを貼ってるボタンを押しても、ラベルを貼ってる所へ、行かずに、動きません・・。ページが何も変わりません・・。 ↓詳しくは、下のURLへ行ってみて下さい。 //jzx100.ifdef.jp/newpage1.html
俺の環境だとまんま動いてますが……。 具体的にはどういう症状だったんでしょうか？
補足
初期画面はページ１が表示されてるようにして、 横のボタンを押すとリンク先がインフレームの中のページ２に飛ばしたいのですが・・。そう設定してるつもりなのですけどね・・。 どこがいけないのか分かりません・・・。 オネガイします・・ぺこ <(＿ ＿)>
えーと……。 x = location.search.substring(1); if ( x != '' ) inframe.location.href="#"+x; </SCRIPT> タグの１つ上の行に、この２行を追加してみてください。 で、".../main.html?label" という呼び出し方をすると、"inframe.htm#label" と記述したのと同じ動作をするはずです。 ただしこの手法は、ＨＴＭＬファイルをサーバーにアップロードした状態でないと動作しません。
補足
回答ありがとうございます。 さっそく２行を追加してみて、 "page01.html?02"と記述し、アップロードしてみたのですが、出来ませんでした・・・。 出来れば、もう少し詳しくオネガイします・・。
どのようにページを作成していて、どのようなソースを書いて、どのような不具合が出ているのか、そのあたりの具体的な情報がないので、かなり曖昧なアドバイスになってしまいますが… インラインフレーム内に呼び出すページにラベルをしてあり、インラインフレーム外のリンクからそのラベル位置を直接呼び出したいということで良いでしょうか。 どうしてもできないと言われても、どのような不具合があるのか解らないので、具体的な対策までは言及できませんが… とりあえず、基本的なことから確認してみてはいかがでしょうか。 ・ラベル位置の呼び出しは、<a href="***.htm#hoge">hogeへ</a>というように、呼び出すページのパスに続けて、「#ラベル名」を記述します(ページ内リンクの場合は、href="#hoge"となります)。 ・インラインフレーム外のリンクから、インラインフレーム内のページのラベル位置に直接飛ばしたい場合は、<a href="***.htm#hoge" target="インラインフレーム名">hogeへ</a>と、target属性でiframe要素で設定したnameの値を指定します。 ・なお、ブラウザによっては、ラベル名に2バイト文字を使うと不具合があるケースもあるそうです。 いろいろなブラウザで閲覧される可能性のあるページでしたら、ラベル名にひらがな・カタカナ・漢字・外字などは使わないようにするのが無難なようです。 一応、以上のような基本的なところから、落ち着いて確認してみると良いと思います。 リンクのイメージにロールオーバーを設定していても、それがハイパーリンクの動作に支障をきたす事はないように思います。 直接の関係はないのではないでしょうか。 ロールオーバーに問題があるかないかを確認するには、そのリンクの中の画像を、テキストに置き換えて動作をチェックしてみるのが良いでしょう。 リンクイメージをテキストに置き換えた時に、問題が解消されるようであれば、ロールオーバー機能が干渉しているということになるでしょうけど、テキストに置き換えても問題が残るようであれば、ロールオーバーは無関係と言う事が確認できます。 とりあえずは、リンクのソースの記述の確認(ラベル名が間違っていないかどうかなど)、ラベル名の設定のし直しなどを試してみるのが良いと思います。 どうしても問題が解消しない場合は、具体的にどのようなソースを書いていて、どのような動作を狙っていて、どのような不具合があるのかの具体的な現象(そのリンクをクリックした時にどういう動作をするのか)等を補足してみてください。 参考になれば…
補足
回答してくださってありがとうございます！ やっぱり文章だけだと伝わりにくいですよね・・・。 ということで、ソースを表示します。 ＨＰビルダーで作成してるので、複雑だとは思いますが・・。 //main.html <HTML> <HEAD> <TITLE>参考</TITLE> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META name="GENERATOR" content="IBM WebSphere Homepage Builder Version 6.0.2.1 for Windows"> <META http-equiv="Content-Style-Type" content="text/css"> <SCRIPT language="JavaScript"> <!-- // HpbImgPreload: function HpbImgPreload(){ var appVer=parseInt(navigator.appVersion); var isNC=(document.layers && (appVer >= 4)); var isIE=(document.all && (appVer >= 4)); if (isNC || isIE){ if (document.images){ var imgName = HpbImgPreload.arguments[0]; var cnt; swImg[imgName] = new Array; for (cnt = 1; cnt < HpbImgPreload.arguments.length; cnt++){ swImg[imgName][HpbImgPreload.arguments[cnt]] = new Image(); swImg[imgName][HpbImgPreload.arguments[cnt]].src = HpbImgPreload.arguments[cnt]; } } } } // HpbImgFind: function HpbImgFind(doc, imgName){ for (var i=0; i < doc.layers.length; i++){ var img = doc.layers[i].document.images[imgName]; if (!img) img = HpbImgFind(doc.layers[i], imgName); if (img) return img; } return null; } // HpbImgSwap: function HpbImgSwap(imgName, imgSrc){ var appVer=parseInt(navigator.appVersion); var isNC=(document.layers && (appVer >= 4)); var isIE=(document.all && (appVer >= 4)); if (isNC || isIE){ if (document.images){ var img = document.images[imgName]; if (!img) img = HpbImgFind(document, imgName); if (img) img.src = imgSrc; } } } var swImg; swImg=new Array; //--> <!-- HpbImgPreload('sankou', 'sankou01.gif', 'sankou011.gif'); //--> </SCRIPT> </HEAD> <BODY> <TABLE> <TR> <TD valign="top" width="90"><BR> <A href="page01.html#02" onmouseout="HpbImgSwap('sankou', 'sankou01.gif');" onmouseover="HpbImgSwap('sankou', 'sankou011.gif');" target="inframe"> <IMG src="sankou01.gif" width="90" height="15" border="0" name="sankou"> </A><BR> </TD> <TD background="bgimage.gif"> <IFRAME name="inframe" src="page01.html" style="border:none;filter:Alpha(opacity=80);" frameborder="1" width="300" height="300" scrolling="yes"></IFRAME> </TD> </TR> </TABLE> <BR> </BODY> </HTML> //page01.html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <TITLE>ページ</TITLE> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META name="GENERATOR" content="IBM WebSphere Homepage Builder Version 6.0.2.1 for Windows"> <META http-equiv="Content-Style-Type" content="text/css"> </HEAD> <BODY> <A name="01"><BR></A> <FONT size="2">ページ１<BR></FONT> <BR> <BR> <BR> <BR> <A name="02"><BR></A> <FONT size="2">ページ２<BR></FONT> <BR> <BR> <BR> <BR> <BR> <BR> <BR> <BR> <BR> <BR> <BR> <BR> <BR> <BR> <BR> </BODY> </HTML> ↑こんな感じです。 よろしくお願いします・・。
外からインラインフレーム内の情報を直接参照するということは、通常であれば、そのインラインフレームが全面に表示されてしまうということです。 そうでなく、外からリンクしてきた際に、インラインフレーム内の特定のラベル位置が表示されているようにしたいということであれば、 <iframe src="inframe.htm#label"> といったふうに、最初からラベルを指定しておく方法があります。 インラインフレーム内のどのラベル位置が初期表示されているかを外部からコントロールしたいという場合には、JavaScript による制御が必要です。
補足
回答ありがとうございます。 最初に、ラベル指定をしたら、ちゃんと出来ました。 ですが、そのあとの、ラベルへの切り替えが出来ませんでした・・。 外のリンクが何個かあり、それを押すことで指定しているラベルへ、飛ばしたいと思っております・・。 JavaScriptを、あまり記述したことがないので、JavaScriptによる制御をどう記述していいのか、分かりません・・。 アドバイスお願い致します・・。
お礼
最初に <A href="#02" target="inframe"> 書いていたんですけど、動かなかったんですよ・・・。 多分、ＩＥでの動作不具合だと思います・・。 それか、私が、登録している無料ＨＰさんが、JavaScriptを受付けないのかもしれません・・・。 これからは、ラベルで区切るのではなく、１ページづつに分けようと思います・・。 いろいろアドバイスしてくださってありがとうございました・・。 ぺこ <(＿ ＿)>