• ベストアンサー

新しい子ウィンドウを開くと古い子ウィンドウのすぐ上に表示されるようにしたい。

Javascript初心者です。わかりやすく具体的に教えてください。 親ウィンドウから画像1、画像2にリンクを張り、それぞれ子ウィンドウとして開きます。 現在はつぎのようにしています。 <script type="type/javascript"> function wopen1{ window.open('画像1のURL','new1',scrollbars=no,resizable=no,width=420,height=280');} function wopen2{ window.open('画像2のURL','new2',scrollbars=no,resizable=no,width=300,height=450');} </script> <body> <a href="#" onClick="wopen1()">画像1</a> <a href="#" onClick="wopen2()">画像2</a> </body> これだと画像1を開いた後に画像2を開くと階層的(レイヤー的?)に上から順に「画像2の子ウィンドウ>親ウィンドウ>画像1の子ウィンドウ」と表示されます。 これを「画像2の子ウィンドウ>画像1の子ウィンドウ>親ウィンドウ」の順で表示されるようにしたい。 また、画像2を開いた後に画像1を開く場合は同様に「画像1の子ウィンドウ>画像2の子ウィンドウ>親ウィンドウ」となるようにしたい。 どうしたらよいでしょうか? よろしくお願いします。

質問者が選んだベストアンサー

  • ベストアンサー
  • arexis
  • ベストアンサー率66% (66/99)
回答No.3

訂正: <script type="text/javascript"> function wopen1(){ wo1 = window.open('1.jpg','new1','scrollbars=no,resizable=no,width=420,height=280'); if(self.wo2 && !wo2.closed){ wo2.focus();} wo1.focus(); } function wopen2(){ wo2 = window.open('2.jpg','new2','scrollbars=no,resizable=no,width=300,height=450'); if(self.wo1 && !wo1.closed) { wo1.focus(); } wo2.focus(); } </script> <a href="#" onClick="wopen1()">画像1</a> <a href="#" onClick="wopen2()">画像2</a> この方がエラーが出にくいです。 #1もこれもsafariではうまく行きません。 原因調べていません。

brianpeace
質問者

お礼

教わったとおりやったところうまくいきました。 必ずしも常に同じ動作をするわけではないようですが実用範囲です。 ありがとうございました。

その他の回答 (2)

  • SAYKA
  • ベストアンサー率34% (944/2776)
回答No.2
brianpeace
質問者

お礼

ご回答をありがとうございます。参考になりました。

  • arexis
  • ベストアンサー率66% (66/99)
回答No.1

クリックする時に親ウィンドウが前に出てしまうので、フォーカスで子ウィンドウ達を前に出すしかないかな?と思ったので <script type="text/javascript"> function wopen1(){ wo1 = window.open('1.jpg','new1','scrollbars=no,resizable=no,width=420,height=280'); if(self.wo2){ wo2.focus();} wo1.focus(); } function wopen2(){ wo2 = window.open('2.jpg','new2','scrollbars=no,resizable=no,width=300,height=450'); if(self.wo1){ wo1.focus(); } wo2.focus(); } </script> <a href="#" onClick="wopen1()">画像1</a> <a href="#" onClick="wopen2()">画像2</a> フォーカスをあてる為子ウィンドウは wo1、wo2 のグローバルオブジェクトにしておく。 開いたあとにもう一つ先に開いてる物があれば、先にフォーカスを当ててから、自分にフォーカスをあてる。

brianpeace
質問者

お礼

早速のご回答をありがとうございます。 教えていただいたとおりにやってみました。 すると画像1を開いた後に画像2を開く、あるいは画像2を開いた後に画像1を開くという動作の1回目はいずれもうまくいきました。ところがいずれの場合も開いた画像をいったん閉じて同じ動作をしようとすると画像そのものは開くものの画面下に「ページでエラーが発生しました」と表示されます。

関連するQ&A

  • 子ウィンドウから子ウィンドウ

    子ウィンドウから文字をクリックして、 同じ大きさの子ウィンドウを開かせたいのですが、 下記のJavaScriptでは子ウィンドウが開きません。 子ウィンドウから子ウィンドウを開かせるには どのようにしたらいいのでしょうか? ご回答宜しくお願い致します。 head内は、 <script type="text/javascript"><!-- function subwin(file){ window.open(file,"subwin","resizable=1, width=600, height=500, scrollbars=yes"); } //--></script> body内の呼び出し部分は、 <a href="ファイルのURL" onclick="subwin('ファイルのURL'); return false;">

  • サブウィンドウを開くと親ウィンドウが上に戻ってしまう

    ページ途中のリンクからJavaScriptでサブウィンドウを開くとき、親ウィンドウが上に戻ってしまいます。 これをリンク位置でサブウィンドウが開くようにしたいのです。 どのようにすれば親ウィンドウが動かなくなりますでしょうか。 サブウィンドウ用のJavaScript function wopen1(){ window.open("aaa.htm","plain","scrollbars=yes"); } リンク側 <a href="#" onClick="wopen1()"> どうぞよろしくお願いいたします。

  • ブラウザサイズをフルサイズで表示させる方法

    ブラウザにタイトルバーとスクロールバーとスタートバー以外を表示しないページを作成したいのですが、 XPはOKで、WIN98でうまくいきませんでした。リンク先をクリックすると別ウィンドウが立ち上がる仕組みです。画面サイズに合わせて変わるようなのですが、WIN98では、スクロールバーが途中で切れてしまい、 一番下まで、綺麗に表示できませんでした。これ以外の方法でもかまいませんので、どなたかご伝授いただければと思います。 function wopen(url){ if(screen.width <= 640){ window.open(url,"_blank","resizable=no,menubar=no,status=yes,location=no,scrollbars=yes,toolbar=no,width=640,height=480,left=0,top=0") }elseif(screen.width <= 800){ window.open(url,"_blank","resizable=no,menubar=no,status=yes,location=no,scrollbars=yes,toolbar=no,width=800,height=600,left=0,top=0") }else if(screen.width <= 1024){ window.open(url,"_blank","resizable=no,menubar=no,status=yes,location=no,scrollbars=yes,toolbar=no,width=1024,height=768,left=0,top=0") }else if(screen.width <= 1152){ window.open(url,"_blank","resizable=no,menubar=no,status=yes,location=no,scrollbars=yes,toolbar=no,width=1152,height=864,left=0,top=0") }else if(screen.width <= 1280){ window.open(url,"_blank","resizable=no,menubar=no,status=yes,location=no,scrollbars=yes,toolbar=no,width=1280,height=1024,left=0,top=0") }else{ window.open(url,"_blank","resizable=no,menubar=no,status=yes,location=no,scrollbars=yes,toolbar=no,width=1600,height=1240,left=0,top=0") } return; } : <A href="javascript:wopen('/index.html')">

  • 別窓を開くリンクでリンク元に画像を使用したいのですけども・・・

    いつもお世話になります。 また、問題が発生致しました。 javaScriptで別窓を開くリンクでリンク元に画像を利用したいのですけども検索しても文字からのリンクしか見つからず画像からのリンクを教えて頂きたいのですが、よろしくご指導お願い致します。 <SCRIPT LANGUAGE="JavaScript"> <!--- function wopen1(){ window.open("http://www.yahoo.co.jp","yahoo", "toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=no,width=500,height=300") } //---> リンク元で画像を使いたいです。 <A HREF="javascript: wopen1()">ウィンドウ1</A> これをどのように書き換えれば画像からリンクできますでしょうか? お手数かけますがお願いいたします。

  • リンクを新しいウィンドウで・・・

    ホームページをみようみまねで作ってるのですが、詰まりました。たすけてください! リンク先を新しいウィンドウで開くボタンを並べておいているのですが、複数連続でクリックしたときに、前に開いたウィンドウに上書きされるような設定にしたいのです。(ウィンドウを増やしたくないということです) ソースは <a href="body.html" onclick="window.open('white.html','','width=350,height=380,menubar=no,resizable=no,scrollbars=no,status=no,');"><img src="white.jpg" width="100" height="100" border="0"></a> こんなようなのがいくつも並んでいると考えてください。 このままだと当然ボタンを押した数だけブラウザが立ち上がってしまいますが、新しいウィンドウは1つにしたいのです。 説明がわかりづらくて申し訳ありませんが、どうぞ宜しくお願いします。

    • ベストアンサー
    • HTML
  • 子ウィンドウでウィンドウサイズ固定にしてtarget=

    HPを作っていて親ウィンドウに↓のように <script language="JavaScript"> <!-- function winopen(url){ win=window.open(url,"host","scrollbars=1,width=780,height=480"); } //--> </script> ~略~ <a href="dougu/keito.html" target="_blank" onClick="Javascript:winopen('dougu/keito.html');return false;"><img src="img/item-keito10.gif" width="50" height="38" border="0"> ウィンドウサイズを固定してtarget="_blank"で開いてさらにその子ウィンドウでも同じようにリンクを張って <script language="JavaScript"> <!-- function winopen(url){ win=window.open(url,"host","scrollbars=1,width=780,height=480"); } //--> </script> ~略~ <a href="../wash.html" target="_blank" class="style1" onClick="Javascript:winopen('../wash.html');return false;">こちら</a> とtarget="_blank"でウィンドウサイズを固定しして開きたいのですが同じウィンドウで開いてしまいます。 説明の仕方が分かりづらくてすみません。分からないようでしたら補足いたします。

  • 親ウィンドウがページ先頭にもどってしまいます

    HTMLでホームページ作成作業をしています。 各所でページ内容の詳細を小ウィンドウで表示させるようにしているのですが、小ウィンドウが開くとクリックしたもとの親ウィンドウがページの先頭まで戻ってしまいます。クリックしても親ページが動かない方法がありましたらご教授願います。ちなみにタグはこんな感じです。宜しくお願いします。 <a href="#" onClick="window.open('photo001.html','','width=630,height=450,menubar=no,resizable=yes,scrollbars=yes,status=no,');">写真あり</a>

    • ベストアンサー
    • HTML
  • ジャバスクリプトでウィンドウサイズ指定を複数

    ご覧いただきありがとうございます。 ネットで調べながら独学でジャバスクリプトの設置をしております。 色々ためしたのですが解決できないのでご教授願います。 ウィンドウサイズを指定して新しいウィンドウを開くジャバスクリプトのリンクを、異なる条件で同じページに複数指定することはできるでしょうか。 同ページ内にあるAのリンクはサイズ400×300で、Bのリンクは600×500といった具合にです。 自分なりに考えてみて下記のように記述してみましたが、BのリンクにもAが適用されてしまいました。 ■head内の記述 <head> <script language="JavaScript"> <!-- function wopen1(){ win=window.open("リンクAのURL","new","width=400,height=300","resizable=no","scrollbars=no","menubar=no","toolbar=no","directories=no","status=no","left=100","top=100","screenX=100","screenY=100"); win.moveTo(100,100); } // --> </script> <script language="JavaScript"> <!-- function wopen2(){ win=window.open("リンクBのURL","new","width=600,height=500","resizable=yes","scrollbars=yes","menubar=no","toolbar=no","directories=no","status=no","left=100","top=100","screenX=100","screenY=100"); win.moveTo(100,100); } // --> </script> </head> ■リンク箇所の記述 <a href="javascript:wopen1()">リンクAのテキスト</a> <a href="javascript:wopen2()">リンクBのテキスト</a> head内の記述をひとつだけにすると正常に動作するので、head内の記述が間違っていると思うのですが、よくわかりません。ご教授おねがいいたします。

  • 子ウインドウのスタイルについて

    すみません、分かる方、教えてください。 次のようにJSP内のJavaScriptの関数にて、スタイルを指定しても子ウインドウがサイズ変更できてしまいます。 var style = "width=630,height=400,resizable=0, location=0, menubar=0,scrollbars=yes"; WindowObject = window.open(url,"MAIN",style); resizable=noとしても同様でした。scrollbars=noとした場合はスクロールバーなしとなるのですが何故でしょうか?

  • リンクを新しいウィンドウで・・・2

    QNo.208725で質問した者です。 http://www.okweb.ne.jp/kotaeru.php3?q=208725  ↑読んでいただけるとありがたいです。 おかげさまでウィンドウがいくつも開くという問題は解決できたのですが、今度はクリックしても新しく開いたウィンドウがアクティブになってくれません(2回目のクリック以降)。 ブラウザの中身は確かに書き換わっているので、あとは見えてくれさえすれば・・・というところで困っています。 ソースは <a href="body.html" onclick="window.open('white.html','myWnd','width=350,height=380,menubar=no,resizable=no,scrollbars=no,status=no,');"><img src="white.jpg" width="100" height="100" border="0"></a> これのwhite.htmlとwhite.jpgの部分が違うものが並んでいる感じです。 宜しくお願いします。

    • ベストアンサー
    • HTML

専門家に質問してみよう