JavaScriptでサイズ固定のサブウィンドウ内でページを切り替え表示する方法

前へ 次へ
このQ&Aのポイント
  • JavaScriptでサイズ固定のサブウィンドウ内でページを切り替え表示する方法について教えてください。
  • 現在、<head>内のスクリプトと<body>内のリンクを使用してサブウィンドウを開いていますが、もっと簡単に書く方法はありますか？
  • 同じサブウィンドウで複数のリンクを開きたいのですが、ソースコードを短くする方法はありますか？
回答を見る
  • ベストアンサー

JavaScript:サイズ固定のサブウィンドウ内でページを切り替え表示するソース

<head>内スクリプトで、リンククリック時に開くサブウィンドウの名前・サイズ・スクロール/リサイズ可否を指定して、<body>内のリンクではURLだけを指定すればいいようにしたいのですが、どのようなソースを書けば良いのでしょうか？ いろいろなサイトやここのQ&Aを見てみましたが、<head>内スクリプトで名前・サイズ・URLなど全て指定するものと、いずれも変数(？)だけで具体的に指定しないものしか見つけられませんでした。 今作成しているページでは、 【1】<head>内のスクリプト function imgOpen(theURL,winName,features) { //v2.0 window.open(theURL,winName,features);} 【2】<body>内のリンク <a href="JavaScript:void(0);" onClick="imgOpen('AAAA.html','code','width=450,height=400,scrollbars=yes')"> としてあります。 同じサブウィンドウで開きたいリンクがいくつもあるので、上記【2】の長ったらしいソースを毎々書いている状態です。せめて「'code','width=450,height=400,scrollbars=yes'」を略せたらと思っています。 宜しくご教示のほどお願い致しますm(__)m

noname#50703
noname#50703

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

  • ベストアンサー
noname#65286
noname#65286
回答No.1

> せめて「'code','width=450,height=400,scrollbars=yes'」を略せたらと思っています。 【1】<head>内のスクリプト function imgOpen(theURL) { //v2.0 window.open(theURL,'code','width=450,height=400,scrollbars=yes');} 【2】<body>内のリンク <a href="JavaScript:void(0);" onClick="imgOpen('AAAA.html')"> 【2】から【1】へ同じ引数を渡すなら、【1】に定数として指定すれば簡単になります。

noname#50703
質問者

お礼

うまくいきました!!ありがとうございました!! 実は早く回答を頂きたかったのですが、投稿の際、「すぐに回答ほしい」にチェックをつけずに投稿してしまい、困っていました… 本当に助かりました。 遅い時間にもかかわらずありがとうございましたm(__)m

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

関連するQ&A

  • JavaScriptを使用したページなのですが

    JavaScriptを使って窓サイズ指定のwindowを開くページなのですが、 私のPCでは問題なく開けるのですが他の人のPCでは見れないという指摘を頂きました。 私が見ている環境はIE6・WindowsXP・セキュリティレベル中です。製作ソフトはDreamWeaverを使っています。 他の人の環境がいまいちよく分からないのですがJavaを使ったらどういった環境の人が見れなくなるのでしょうか？ ちなみにそのページで使用したタグは <script language="JavaScript" type="text/JavaScript"> <!-- function MM_openBrWindow(theURL,winName,features) { //v2.0 window.open(theURL,winName,features); } //--> </script> が<head></head>に入っており<body></body> には <a href="javascript:;" onClick="MM_openBrWindow(profile.htm','prowin','scrollbars=yes,width=600px,height=600px')">です。 よろしくお願いします。

  • サブウィンドウを表示させたいのですが・・・

    こんにちわ。 ちょっとした（といっても、ワード文書１ページ分）説明をサブウィンドウで表示させたいのですが、 できません。 以下がソースです。 ＜メインウィンドウ＞ <HEAD> <SCRIPT LANGUAGE="JavaScript"> <!-- function winOpen(winName,url,W,H){ //サブウインドウオープン var WinD11=window.open(url,winName,'scrollbars=1,width='+W+',height='+H+''); WinD11.document.close() } //--> </SCRIPT> </HEAD> <BODY> <A HREF="javascript:function voi(){};voi()" onClick="winOpen('','link1.html',400,200)"> この文字をクリックすると説明ウインドウ1が開きます </A> </BODY> 何が間違ってるのかご指導いただけないでしょうか？ よろしくお願いいたします。m(__)m

  • サブウィンドウの親の位置

    こんにちわ。 メインウィンドウから、サブウィンドウを開くようになっています。 メインウィンドウが縦に長く（文章量が多い）、下の方のリンクでサブウィンドウを開いたときに、メインウィンドウの画面がページの上の方に移ってしまいます。 クリックした場所を維持したいのですが、調べてみたのですが、やり方がわかりません。 すみませんが、よろしくお願いします。 <script> <!-- function MM_openBrWindow(theURL,winName,features) { window.open(theURL,winName,features); } //--> </script> ▼メイン・リンク部分 <a href="#" onClick="MM_openBrWindow('info.html#1','info','width=380,height=500,scrollbars=yes,resizable=yes')">※1</a>

  • JavaScript:メインページからサブウィンドウページを遷移させる際

    メインページにボタン画像3つを配置して、それぞれからサブウィンドウを任意のサイズで開こうとしています。サブウィンドウの中身はそれぞれ別のものですが、サイズは同じなのでサブウィンドウ内でwinNameを同一にして、遷移させようとしています。ただ、遷移自体はうまくいくのですが、最初のクリックでサブウィンドウはメインウィンドウより前にでますが、そのまま２つ目のボタンで遷移させようとするとサブウィンドウはメインウィンドウの後ろにいってしまいます。どうしたら、サブウィンドウを絶えずアクティブにできるのでしょうか。 メインぺージのＪＳにwindow.focus();をいれたり、サブウィンドウのbodyにonBlur="focus()"をいれたり、サブウィンドウのＪＳにwindow.focus();をいれてもうまくいきませんでした。 どうぞよろしくお願いいたします。 メインページのＪＳ <script language="JavaScript"> <!-- function MM_openBrWindow(theURL,winName,features) { //v2.0 window.open(theURL,winName,features); } //--> </script> ボタン画像のＪＳ Ａボタン：<A href="javascript:void(0); " onClick="MM_openBrWindow('a.html','LA','width=320,height=255')"><IMG SRC="images/t_large.jpg" ALT="Large" WIDTH="120" HEIGHT="28" VSPACE="5" border="0"></A> Bボタン：<A HREF="javascript:void(0); " onClick="MM_openBrWindow('b.html','LA','width=320,height=255')"><IMG SRC="images/t_large.jpg" ALT="Large" WIDTH="120" HEIGHT="28" VSPACE="5" BORDER="0"></A>

  • 新しいウィンドウを中央に

    以下のソースで出来た新しいウィンドウを 画面の中央にもってきたい場合にはどのよう にカスタマイズすれば良いのでしょうか？ どなたか申し訳御座いませんが、 教えて頂けないでしょうか？ 宜しくお願い致します。 <html> <head> <script language="JavaScript" type="text/JavaScript"> <!-- function MM_openBrWindow(theURL,winName,features) { //v2.0 window.open(theURL,winName,features); } //--> </script> </head> <body> <a href="javascript:;" onClick="MM_openBrWindow('test2.html','test','width=300,height=300')">test</a> </body> </html>

  • Javascript　ポップアップウィンドウについて

    初歩的なことだとは思いますが、教えてください。 ポップアップウィンドウで画像を表示するためのリンクを以下のように記述して使っていますが、 ポップアップウィンドウ内に余白が出ます。（ウインドウ枠と画像の間） ウインドウの左上（0,0）の位置に画像を持ってくるにはどうしたらいいのでしょうか。 調べたものをいくつか試してみましたが、どれもうまくいきませんでした。 よろしくお願いします。 -------------------- ■<head>内 <script type="text/javascript"> <!-- function MM_openBrWindow(theURL,winName,features) { //v2.0 window.open(theURL,winName,features); } //--> </script> ■<body>内 <a href="img/test.gif"><img alt="" src="～.gif" onclick="MM_openBrWindow('img/test.gif','test','scrollbars=yes,width=950,height=400')" /> </a> ------------------------- もしくは、 ■<head>内 <script type="text/javascript"> <!-- function WindowOpen_01(){ window.open('test.gif','test','scrollbars=yes,width=1150,height=350,left=0,top=0'); } //--> </script> ■<body>内 <a href="javascript:WindowOpen_01()"><img src="img/table_off.gif" alt="" width="320" height="55" class="mar_t_10" onmouseover="this.src='img/table_ban_on.gif'" onmouseout="this.src='img/table_off.gif'" /></a>

  • 指がでてきません

    初めてJavaScriptを使って、画像・テキストをクリックしたら別ウィンドが開くようにしました。 大きさを整えたりスクロールを出したり、苦戦しやっとできたのですが、 OnMouseの時にポイントが「指」に変化しません。 「矢印」のままなので、HPを見た人はそこから別の所へリンクしていることが分からないのです。 比較するものがないのでどこをどう調べたらよいか見当がつかないのですが、どなたかヒントをいただけませんか？ （参考までに載せてみます） <script language="JavaScript"> <!-- function MM_openBrWindow(theURL,winName,features) { //v2.0 window.open(theURL,winName,features); } //--> </script> －－－本文中－－－ <img src="img/××.jpg" width="100" height="100" border="0" onMouseDown="MM_openBrWindow('××.htm','××','scrollbars=auto,resizable=auto,width=350,height=420')">

  • JavaScriptソース

    文字列をクリックするとサブウィンドウが開くという JavaScriptです。必死にやってみましたが、IEではOK、ネスケでは作動しません。何度も何度もやってもだめで、どこからみても見本のソースと一緒なのにできません。ネスケでは厳密に作らないとだめだとか。すいません、どこが変なのでしょう。下にソースをのせます。よろしくお願いします。 <HEAD>～</HEAD>の間 <SCRIPT language="JavaScript"> <!-- function WinOpen1(){ window.open('SUBWSOURCE/uosu1.html','window2','resizable=1,scrollbars=0,menubar=0,directories=0,status=0,location=0,width=600,height=500'); } // --> </SCRIPT> <BODY>の部分 <td width="140"><p><img src="TOPPARTS/OSUTOP01.JPG" width="140" height="80" border="0"><br> <img src="common/spacer.gif" width="1" height="5" border="0"><br> <a href="javascript:WinOpen1();"><font size="2">文字列</a></font><font size="1">テキスト</font></td> </tr> </table> ちなみにここでは１つ分ですが、実際は１０のウィンドウが開くよう指示しています。大変見にくいとは思いますが、よろしくおねがいします・・。

  • 小窓を開くにはどうしたらいいのでしょうか？

    Dreamweaverでサイトを作成中なのですが、 親サイトでこのように <form　name="form1"method="post"action="http://www.xxx.com/cgi-bin/○○○.cgi"> <input type="submit" name="submit" value="▲▲▲"onClick="MM_openBrWindow('http://http://www.xxx.com/cgi-bin/○○○.cgi,'','scrollbars=no,resizable=yes,width=500,height=600')"> </form> 設定し、小窓でcgiの結果を出したいのですが、 小窓が開かず、そのまま画面が変わってしまいます。 ちなみにheadにも <script language="JavaScript"> <!-- function MM_openBrWindow(theURL,winName,features) { //v2.0 window.open(theURL,winName,features); } //--> </script>としています。 今日午前からずっと色々試行錯誤しながら、 チャレンジしてみましたが、どうしても 原因が分かりません。 どなたか教えて下さい。

  • 複数のウィンドウを開く方法

    javascriptが良くわかりません。 以下のソースで、レシピAをクリックすると別ウィンドウ（picture_a.html）、Bをクリックすると別ウィンドウ（picture_b.htmlというように設定したいのですが、レシピAをクリックしても、レシピBをクリックしても（picture_a.html）しか表示されません。 どこの記述が間違っているか、ご存知の方教えてください。 ---------------- <script language="JavaScript"> <!-- function MM_openBrWindow(theURL,winName,features) { //v2.0 window.open(theURL,winName,features); } //--> </script> ---------------- <body> <a href="picture_a.html" onClick="MM_openBrWindow('picture_a.html','picture_a,'scrollbars=yes, width=500,height=500');return false;"> <p><img src="img/recipe_a.jpg" alt="レシピA" border="0"><br> <br> レシピA</p> </a> <a href="picture_b.html" onClick="MM_openBrWindow('picture_b.html','picture_b,'scrollbars=yes, width=500,height=500');return false;"> <p><img src="img/recipe_a.jpg" alt="レシピB" border="0"><br> <br>レシピB</p></a> </body> ---------------

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

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

質問する