• 締切済み

別窓に背景を表示させたい

別窓を表示した時に、何枚か共通で同じ背景を表示させたいです。 また、窓だけ一緒で、背景の上ないしはインラインフレームの中の画像を変わるがわる表示させる良い方法がありましたら、教えて下さい。 よろしくお願いします。

みんなの回答

  • kokorone
  • ベストアンサー率38% (417/1093)
回答No.3

インラインフレーム編です。 諸事情により、夜間しか回答できませんので、 あしからず。 ★★index2.html★★ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <script language="javascript"> <!--// var hWin; function win_open(w_url) { var w_url; parent.ifpsub.location.href= w_url; } function win_open1(w_url,w_img) { var w_url; var w_img; var cnt; parent.ifpsub.location.href= w_url; setTimeout("win_open2('"+w_img+"')",100) } function win_open2(w_img) { var w_img; parent.ifpsub.document.body.style.backgroundImage ="url("+w_img+")"; } //--> </script> </HEAD> <table> <tr> <td> <A HREF="JavaScript:win_open('inf_chiba.html')">千葉ロッテマリーンズ</A> </td> <td> <A HREF="JavaScript:win_open1('inf_chiba.html','pa_g.jpg')">千葉ロッテマリーンズ</A> </td> </tr> <tr> <td> <A HREF="JavaScript:win_open('inf_fukuoka.html')">福岡ソフトバンクホークス</A> </td> <td> <A HREF="JavaScript:win_open1('inf_fukuoka.html','pa_g.jpg')">福岡ソフトバンクホークス</A> </td> </tr> <tr> <td> <A HREF="JavaScript:win_open('inf_seibu.html')">西武ライオンズ</A> </td> <td> <A HREF="JavaScript:win_open1('inf_seibu.html','pa_g.jpg')">西武ライオンズ</A> </td> </tr> <tr> <td> <A HREF="JavaScript:win_open('inf_orix.html')">オリックス・バッファローズ</A> </td> <td> <A HREF="JavaScript:win_open1('inf_orix.html','pa_g.jpg')">オリックス・バッファローズ</A> </td> </tr> <tr> <td> <A HREF="JavaScript:win_open('inf_hokkaido.html')">北海道日本ハムファイターズ</A> </td> <td> <A HREF="JavaScript:win_open1('inf_hokkaido.html','pa_g.jpg')">北海道日本ハムファイターズ</A> </td> </tr> <tr> <td> <A HREF="JavaScript:win_open('inf_touhoku.html')">東北楽天ゴールデンイーグルス</A> </td> <td> <A HREF="JavaScript:win_open1('inf_touhoku.html','pa_g.jpg')">東北楽天ゴールデンイーグルス</A> </td> </tr> </table> <IFRAME src="inf_sel.html" width="600" height="600" name="ifpsub"frameborder="1" border="1"></IFRAME> </HTML> ★★inf_chiba.html★★ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> </script> </HEAD> <BODY style="background-image:url('pa_a.jpg');background-repeat:no-repeat;background-position: left bottom"> <B> 千葉ロッテマリーンズ </B> </BODY> </HTML> ★★inf_fukuoka.html★★ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> </script> </HEAD> <BODY style="background-image:url('pa_b.jpg');background-repeat:no-repeat;background-position: left bottom"> <B> 福岡ソフトバンクホークス </B> </BODY> </HTML> ★★inf_seibu.html★★ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> </script> </HEAD> <BODY style="background-image:url('pa_c.jpg');background-repeat:no-repeat;background-position: left bottom"> <B> 西武ライオンズ </B> </BODY> </HTML> ★★inf_orix.html★★ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> </script> </HEAD> <BODY style="background-image:url('pa_d.jpg');background-repeat:no-repeat;background-position: left bottom"> <B> オリックス・バッファローズ </B> </BODY> </HTML> ★★inf_hokkaido.html★★ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> </script> </HEAD> <BODY style="background-image:url('pa_e.jpg');background-repeat:no-repeat;background-position: left bottom"> <B> 北海道日本ハムファイターズ </B> </BODY> </HTML> ★★inf_touhoku.html★★ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> </script> </HEAD> <BODY style="background-image:url('pa_f.jpg');background-repeat:no-repeat;background-position: left bottom"> <B> 東北楽天ゴールデンイーグルス </B> </BODY> </HTML> ★★inf_sel.html★★ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> </script> </HEAD> <BODY style="background-image:url('pa_g.jpg');background-repeat:no-repeat;background-position: left bottom"> <B> チーム名を選択してください。 </B> </BODY> </HTML>

  • kokorone
  • ベストアンサー率38% (417/1093)
回答No.2

まずは、別窓編です。 ★★index1.html★★ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <script language="javascript"> <!--// var hWin; function win_open(w_url) { var w_url; window.open(w_url, "Test", "width=500,height=500"); } function win_open1(w_url,w_img) { var w_url; var w_img; hWin = window.open(w_url, "Test", "width=500,height=500"); hWin.document.body.style.backgroundImage ="url("+w_img+")"; } //--> </script> </HEAD> <table> <tr> <td> <A HREF="JavaScript:win_open('inf_chiba.html')">千葉ロッテマリーンズ</A> </td> <td> <A HREF="JavaScript:win_open1('inf_chiba.html','pa_g.jpg')">千葉ロッテマリーンズ</A> </td> </tr> <tr> <td> <A HREF="JavaScript:win_open('inf_fukuoka.html')">福岡ソフトバンクホークス</A> </td> <td> <A HREF="JavaScript:win_open1('inf_fukuoka.html','pa_g.jpg')">福岡ソフトバンクホークス</A> </td> </tr> <tr> <td> <A HREF="JavaScript:win_open('inf_seibu.html')">西武ライオンズ</A> </td> <td> <A HREF="JavaScript:win_open1('inf_seibu.html','pa_g.jpg')">西武ライオンズ</A> </td> </tr> <tr> <td> <A HREF="JavaScript:win_open('inf_orix.html')">オリックス・バッファローズ</A> </td> <td> <A HREF="JavaScript:win_open1('inf_orix.html','pa_g.jpg')">オリックス・バッファローズ</A> </td> </tr> <tr> <td> <A HREF="JavaScript:win_open('inf_hokkaido.html')">北海道日本ハムファイターズ</A> </td> <td> <A HREF="JavaScript:win_open1('inf_hokkaido.html','pa_g.jpg')">北海道日本ハムファイターズ</A> </td> </tr> <tr> <td> <A HREF="JavaScript:win_open('inf_touhoku.html')">東北楽天ゴールデンイーグルス</A> </td> <td> <A HREF="JavaScript:win_open1('inf_touhoku.html','pa_g.jpg')">東北楽天ゴールデンイーグルス</A> </td> </tr> </table> </HTML> ★★inf_chiba.html★★ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> </script> </HEAD> <BODY style="background-image:url('pa_a.jpg');background-repeat:no-repeat;background-position: left bottom"> <B> 千葉ロッテマリーンズ </B> </BODY> </HTML> ★★inf_fukuoka.html★★ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> </script> </HEAD> <BODY style="background-image:url('pa_b.jpg');background-repeat:no-repeat;background-position: left bottom"> <B> 福岡ソフトバンクホークス </B> </BODY> </HTML> ★★inf_seibu.html★★ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> </script> </HEAD> <BODY style="background-image:url('pa_c.jpg');background-repeat:no-repeat;background-position: left bottom"> <B> 西武ライオンズ </B> </BODY> </HTML> ★★inf_orix.html★★ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> </script> </HEAD> <BODY style="background-image:url('pa_d.jpg');background-repeat:no-repeat;background-position: left bottom"> <B> オリックス・バッファローズ </B> </BODY> </HTML> ★★inf_hokkaido.html★★ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> </script> </HEAD> <BODY style="background-image:url('pa_e.jpg');background-repeat:no-repeat;background-position: left bottom"> <B> 北海道日本ハムファイターズ </B> </BODY> </HTML> ★★inf_touhoku.html★★ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> </script> </HEAD> <BODY style="background-image:url('pa_f.jpg');background-repeat:no-repeat;background-position: left bottom"> <B> 東北楽天ゴールデンイーグルス </B> </BODY> </HTML>

  • kokorone
  • ベストアンサー率38% (417/1093)
回答No.1

Ｑ１： 　別窓で表示するHTMLは、既に用意されている 　のですか？親窓から、ＪＳですべて作りこむ 　のですか？ Ｑ２： 　背景・画像を変えるのは、どんなタイミング 　なのですか？

erika_oe
質問者

補足

すみません、補足遅くなりました。 書き込んだのが消えてたみたいです。。。。? 別窓だけHTMLで作成して、表示させる内容は画像とかにしようと思ってます。 タイミングは。クリックにて。本体の窓の文章をクリックした時に、画像が切り変わればいいと思ってます。

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

関連するQ&A

  • 別窓表示の枠しか出てこない・・・

    サイト巡りをしてる時にサイトの「リンク集」などから他のサイトに行くことがありますが、その際に別窓が開いてサイトが表示されることがよくあるのですが、何故か昨日から急に別窓での表示が出来なくなりました。 ウィンドウは開くのですが、中が真っ白で画像も文字も何も表示されません。上の方のアドレスが表示される所（アドレスバー？）も真っ白のまま。 私のパソコンはWinＭＥです。 誰か解決法があればご回答願います。 宜しくお願いします。

  • 別窓のインラインフレームの中身を変更する

    javascript初心者です。 HPを作成中ですが、FLASHが全くわからないので、javascriptでアルバムを作っています。 メインページで何月が選択できるようになっており、クリックすると別窓が出ます。 別窓にはインラインフレームでサムネイル表示させ写真を選べるようにしています。 別窓のファイルは１つ（album.html)にし、メインページからインラインフレームの中身（1月.html,2月.html etc...)を変えようとしています。 プログラムはこのようにしました。 subWin = window.open("***"); function ***() { subWin.インラインフレーム名.location.href = ***.html; } 最初、インラインフレームの中身がうまく表示されなくて、プログラムが間違っているのかと思ったのですが、プログラムエラーは出ず、アクティブコントロールがどうのこうのって表示が出たので、試しに『マイコンピュータのファイルでのアクティブコンテンツ実行を許可する』にしてみたところ、ちゃんと表示されました。 しかし、ちょっと不安定なんです。 連続でメインページの月選択を押すと（そんな人はいないでしょうけど）表示されたりされなかったり・・・ javascriptを使うとそんなもんなんですか？ それと、自分のPCでは見れてもサーバーにアップして公開しても他の人には見れるか心配です。 素直に別窓をフレーム分割して作る方法もありますが、そうするとファイル数が倍になるので今回javascriptを使いました。 プログラムが間違っているのか、そもそも別窓のインラインフレームを指定することが間違っているのか、不安定の原因をお教えください。

  • Webペーの背景にWebページを表示する

    Webページの背景として、画像や色ではなく、Webページを表示することは可能でしょうか？ 背景として利用したいページが簡単に編集できるのならよいのですが、サイト内のすべてのページで共通にしたいとかいうことがあって、インラインフレームは利用できません。 ですから、背景に利用したいページを編集するつもりはありません。 お願いします。

    • ベストアンサー
    • HTML
  • 別窓が小さくなってしまいました。

    急になってしまったのですが、 例えば、とあるサイトを見ていて、 リンク先をクリックすると、別窓が開く時ってありますよね。 普通なら、今開いているのと同じ大きさの窓が開くのに、 ４分の１ほどの大きさになってしまいました。 上の、最大化を押すと大きくなりますが、 その開いた別窓を閉じて、また他の窓を開くと、 やはり小さいです。 今までのとおり、大きい窓を開く方法って何かないのでしょうか？ 別に故障してる訳ではなさそうですが、 いちいち大きくしなければならないので不便で・・・。 なにかいい方法があれば教えて下さい。 宜しくお願いいたします。

  • 別窓が開かない

    質問なんですが、単純にサイト巡りをしてる時にサイトの「リンク集」などから他のサイトに行くことってありますよね。 その際に別窓が開いてサイトが表示されることがよくあるのですが、何故か最近 急に別窓での表示が出来なくなりました。 ウィンドウは開くのですが、中が真っ白で画像も文字も何も表示されません。 このサイトの過去の質問で同じような質問が出されていたのですが、その方のPCはWin98でした。 僕のは、WinXPなのでそのままの対処法でやっていいものかどうか解らなくて。。。 ちなみに関係があるか無いか解りませんが、PCを起動した際に“ランタイムエラー”なるものが表示されます。 誰か解決法のある方いませんでしょうか？ 宜しくお願いします。

  • インラインフレームの一部を撮って別窓に表示するには？

    こんばんは。いつもお世話になっています。 インラインフレームの一部（厳密に言うと横が0pxから200pxで縦が0pxから270pxです）をPrint Screenキーで撮とったようにして、それを別窓で表示するにはどうしたらいいんでしょうか？ 一応onclickを使う予定です。 JavaScript PrintScreenなどで調べてみても、検索単語が悪いのか、期待したものはでてきませんでした。 お願いいたします。

  • インラインフレームから別フレームの背景画像変更

    ○ページの構造 親ページ ├フレームA └フレームB - インラインフレームC ○インラインフレームC内ページ <script type="text/javascript"> <!-- function bgchange(bgname) { parent.A.document.body.background = bgname; } // --> </script> <span onclick='bgchange("img.gif");return false'>背景画像変更！</span> ＊ インラインフレーム内の「背景画像変更！」クリックでAフレームの背景画像が変わるようにしたいのですが、 上のスクリプトだとAB間、B→C、でしか機能しません。どなたか手直しをして頂けないでしょうか？

  • 別窓が開きません

    よろしくお願いします。 WIN98,IE5.5SP2 を利用しています。 先ほど急に窓が開かなくなりました。 下に新しい窓が出ると、いままでは新しく出た窓のページが表示されてましたが、なぜか表示されません。 右クリックして「最大」を選ぶと開きます。 また窓を新しく出したときに、上のほうに 最大・最小・閉じるのアイコンが出ます。 これをクリックしても開きます。 しかし、とても不便でしかたが有りません。 昨日ノートンのアンチウィルスの体験版を入れたほかは、何もいじってません。 ただ、体験版入れた後も、先ほどまでは普通に動いてました。 ただ一つ、左下にあるIEのアイコンをクッリクした場合は、別窓が開きます。 直す方法があれば教えてください。 宜しくお願いします。

  • 背景色を２色表示させたい

    ＨＴＭＬを始めたばかりの初心者です。 スタイルシートを使ってメール用のひな形を作っているのですが、わからないところがあるので教えてください。 どの本やサイトを見ても背景色を２種類表示させる指定が載ってないのです。 そういったことは可能ですか？ たとえば上から７０ピクセルをＡの色で表示させ、その下から全てをＢの色で表示させたいのです。さらにＡの色の上に背景透過性の画像を横並びで表示させたい・・（画像の背景色は使いたくないので）。 メールのひな形ですのでテキストは一切入力しません。画像のみです。 稚拙な質問ですみません。よろしくお願いします。

    • ベストアンサー
    • HTML
  • 別窓を開くプログラムについて

    はじめまして。初めての投稿の者です。 今回、ご相談の件ですが、 現在、webを制作してて、サムネイル（画像）をクリックすると別窓が開いて画像を大きく表示させるという風に作っています。 <script language="javascript"> <!-- function open_window(spass){window.open(spass,"flow","scrollbars=1,resizable=0,width=1000,height=760,left=0,top=0")} --> </script> ～～～中略～～～ <body> <a href="javascript:open_window('ファイル名.html')"><img src="画像のファイル名" width="250" height="150" alt="---"></a> ～～～中略～～～ この方法の場合、大きく表示させる画像のサイズによっては別窓に表示させたとき、ウィンドウに余白ができてしまいます。 width=1000,height=760の部分を無くして、なお且つ別窓に表示させたときの画像の周辺に余白が無いように・・と、色々とjavascriptに関するサイトや講座を拝見して調べてみましたが希望のような事が有りませんでした。 また、<a href="javascript:open_window('ファイル名.html')">・・ の箇所を、 open_window('大きく表示する画像のファイル名.jpg')・・ としても、ダメでした。 何がしたいかと申し上げますと、（別窓：ウィンドウに）大きく表示させる画像の周辺に余白が発生させないよう、ピッタリと収めさせる別窓にしたいです。【マージンによる多少の余白は可】 ※画像（写真）サイズに合わせて別窓も、そのサイズに開くと言えばお分かりでしょうか？ 技術者の方・経験者の方からアドバイス等ご教授戴けたら・・と思いますので、宜しくお願いします。

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

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

質問する