• ベストアンサー

javascriptで別ウインドウを開いたのですが背景設置が上手くいきません。

いつもお世話になっております。 JavaScriptを使用し別ウインドウで画像を表示させているのですが、 そのウインドウの背景が上手く設定できません。 どのように編集すればよいでしょうか? 現在の状態は以下の通りです。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <title>aaa</title> <script language="javascript"> <!-- function OpenWindow(){ var width = document.images['00'].width + 228; var height = document.images['00'].height +254; subWin = window.open("","subWin","status=no,menubar=no,toolbar=no,scrollbars=no,resizable=yes,screenX=0,screenY=0,width=" + width + ",height=" + height + '"'); with(subWin.document) { open(); write("<html><head><title>sample1</title></head>"); write("<body onload='window.resizeTo( document.images[00].width + 40,document.images[00].height + 120)'><div align='center'><img id='00' src='b/1b.jpg'><br>"); write("<button type='button' onclick='window.close()'>閉じる</button></body></div></html>"); close(); } } --> </script></head> 宜しくお願いします。

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

  • ベストアンサー
  • LLLuna
  • ベストアンサー率35% (13/37)
回答No.3

background属性より、style属性で背景を指定する方を推奨します。 変える箇所は1氏と同じですが、 background='背景画像URI' ではなく、 style='background:url(背景画像URI)【半角スペース】背景色;color:文字色' のようにします。(背景画像を使うときは、それと似た色を同時に指定します。また、文字色も同時に指定することを推奨します〈文字色:黒がデフォルトとは限らないので〉) なお、script要素のlanguage属性は非推奨です。代わりにtype="text/javascript"を記述してください(仕様上必須)。また、あまり知られていませんが、HTML文書内に埋め込むスクリプトでは、「</」を書き込めないことになっております。「<\/」「<"+"/」などとして下さい。

全文を見る
すると、全ての回答が全文表示されます。

その他の回答 (2)

  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.2

とりあえずコーテーションの閉じ方にミスが ありますね。 ×subWin =window.open(・・・" + height + '"'); ○subWin =window.open(・・・" + height + "'");

全文を見る
すると、全ての回答が全文表示されます。
  • BLUEPIXY
  • ベストアンサー率50% (3003/5914)
回答No.1

>write("<body onload=… のところで write("<body background='b/back.gif' onload=… とでもすればいいと思います。 style を使うというのもありますが

全文を見る
すると、全ての回答が全文表示されます。

関連するQ&A

  • 画像をクリックすると閉じる別ウインドウ

    こんにちは。上記タイトルのページを作りたいと思っています。 親ページには <script language="JavaScript"> <!-- // var new1,win1p; function CenterOpen (img,Xv,Yv) { if (win1p=="on") { if (new1.closed) {} else {new1.close();} } win1p = "on"; Xw=Xv+50; Yw=Yv+80; new1=window.open("", "newwin", "resizable=1,width="+Xw+",height="+Yw+""); if(navigator.appVersion.charAt(0)>=3){new1.focus()}; new1.document.clear(); new1.document.write("<html><head><meta http-equiv=Content-Type content=\"text/html; charset=x-sjis\"><title>View Window</title></head><body bgcolor=#000000><table width=100% height="+Yv+" border=0 cellpadding=0 align=center valign=center>"); new1.document.write("<tr><td align=center valign=center><img src="+img+" width="+Xv+" height="+Yv+"></td></tr></table>"); new1.document.write("<center><form><input type=button value='close' onClick='window.close()'></form></center>"); new1.document.write("</body></html>"); new1.document.close(); } //--> </script> 画像リンクには <a href="JavaScript:onClick=CenterOpen('●●.jpg',サイズ,サイズ);"> こんな感じで作ってあります。 この new1.document.write("<center><form><input type=button value='close' onClick='window.close()'></form></center>"); 画像ボタンがいらないのでここを抜いて 画像をクリックすると子ウインドウが閉じるようにしたいのですが、うまくいきません。このサイトもいろいろ見ましたがよくわかりませんでした。 どなたかご教示下さい。よろしくお願いします。

  • 別ウィンドウが開かない/JavaScript

    お世話になります。手探りで参考書やwebで調べながらHP作成しています。javascriptで、文字をクリックすると別ウィンドウ(画像にあわせたウィンドウサイズ)が開くようにしたいのですが、うまくいきません。お手数おかけしますが、教えていただけますようお願いします。 <html> <head> <title>sample</title> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <style type="text/css"> <!-- body{ background: #FFFFFF; font-size :12px; line-height :100%; } .sserif省略 .serif省略 .jgothic省略 hとpのスタイル指定タグ省略 a:link 省略 a:visited 省略 a:hover 省略 --> </style> <SCRIPT LANGUAGE="JavaScript"> <!-- function subwin(wURL,wName,wOption){ window.open(wURL,wName,wOption,status=no,scrollbars=no,directories=no,menubar=no,resizable=no,toolbar=no right=0px); } //--> </SCRIPT> 検索避けmetaタグ省略します </head> <body bgcolor="#FFFFFF" text="#000000" link="#000000" vlink="#000000" alink="#FF0066" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <table border="0" width="400" cellspacing="0" cellpadding="0" align="center"> <tr> <td><img src="sample/topgazou.jpg" width="700" height="400" border="1"></td> </tr> <td width="400" height="40" bgcolor="#FF0066" valign="middle"> <h1>sample</h1> </td> </tr> <tr> <td> <br><h2>PICTURE</h2> <p><a href="javascript:subwin('sample/gazou.htm','window1','width=453,height=700','right=0px')">gazou</a></p> ★1.upしてこのページにいくとエラーが発生します。 [エラー内容] ライン:53 文字:116 エラー:')'がありません。 コード:0 ★2.別ウィンドウのリンクを貼った箇所をクリック、開かずまたエラーが出ます。 [エラー内容] ライン:1 文字:1 エラー:オブジェクトを指定してください コード:0 ★winXP/メモ帳で作成後、Dreamweaverでup、I.E6.0とFireFoxで確認、開かない。その他可笑しいところだらけだと思いますので教えて下さると助かります。

  • css javascriptについて教えて下さい。

    下記のように、ボタンを押すとdivタグの中にpタグを表示するようにしました。 そこで、そのpタグがdivタグの中央から表示するようにしたいのですが、できません。cssでpタグの左右のmarginをautoにするのかくらいしか思いつかず困っています。pタグがdivタグの中央から表示されるようにするにはどうしたらよいでしょうか。教えて下さい。 <!doctype html> <html> <head> <meta charset="utf-8"> <title>無題ドキュメント</title> <style> #w{ width:500px; height:50px; border : solid 1px; overflow: hidden; } p{ display:inline-block; width:50px; height:50px; margin-left:auto; margin-right:auto; } </style> <script type="text/javascript" language="javascript"> var count = 0; var box; window.onload = function() { box = document.getElementById("w"); } function btnClick(){ var pNode = document.createElement("p"); pNode.innerHTML = count;   box.appendChild(pNode); count ++; } </script> </head> <body> <div id="w"></div> <button onClick="btnClick()">Pタグを生成</button> </body> </html>

    • ベストアンサー
    • HTML
  • JavaScript内からJavaScriptを書き出したいのですが

    こんにちは. JavaアプレットとJavaScriptを利用してJavaScriptを書き出すコードを書いてみたのですが,うまく動きません.具体的なコードは以下のようで,リンクはできるのですが,マウスを乗せるとオブジェクトを指定してくださいとエラーがでます.innerHTMLでJavaScriptを書き出すことはできないのでしょうか? <html> ・・・ <body> <SCRIPT language="JavaScript" type="text/javascript"> <!-- function dWrite(){ str='<script type="text/javascript">functionLinkMo(){varLM1;LM1=window.open"","Doc","toolbar=no,location=no,kdirectories=no,width=300,height=250");LM1.document.write"<html><head><title></title></head><body>testです/body></html>");LM1.document.close();}</script><body>rinku <ahref="#"onMouseOver="LinkMo()">ここにのせると</a></body></html>'; document.getElementById("here").innerHTML=str;} //--> </script> <applet ・・・dWriteを呼び出す></applet> <div id="here" style="position:absolute;width:600px; left:0px;top:0px;"> </div></body></html>

  • 小窓の出し方について教えて下さい。(2)

    http://oshiete1.goo.ne.jp/kotaeru.php3?q=568520 先ほどご回答を頂き、小窓の開き方は解決致しました。 ↓ <script type="text/javascript"><!-- function subwin(imgsrc,imgalt){ sub1=window.open("","subwin","width=230,height=160,resizable=1"); sub1.document.open(); sub1.document.write("<html><head><title>"+imgalt+"</title></head>"); sub1.document.write("<body style='margin: 0;'>") sub1.document.write("<img src='"+imgsrc+"' alt='"+imgalt+"'>"); sub1.document.write("</body></html>"); sub1.document.close(); } //--></script> body内の、呼び出し部分は、 <a href="#" onClick="subwin('画像ファイルのURL','画像ファイルの説明'); return false;"><img src="p_1.jpg" border="0" width="70" height="48"></a> が、クリックして開く小窓に表示させるHTMLファイルで開かせたい 画像が同じページにあります。(大きさは横500縦600) もう1つ教えて頂いた↓ <script type="text/javascript"><!-- function subwin(file){ window.open(file,"subwin","resizable=1, width=230, height=160"); } //--></script> 以上をhead内に記述して、呼び出し部分は <a href="#" onClick="subwin('読み出すHTMLファイルのURL'); return false;"><img src="p_1.jpg" border="0" width="70" height="48"></a> のwidth=230, height=160をwidth=500, height=600にして上記ソースに加えると(?) 全部の小窓がwidth=500, height=600になってしまいます。 width=230, height=160の画像で開かせる小窓と width=500, height=600のHTMLで開かせたい小窓を 同じページに加えるには、どうしたらよいのでしょうか? ご回答宜しくお願い致します。

  • JavaScript 画像のサイズを取得して、それに適したウインドウを表示したい

    画像のサイズを取得して、それに適したウインドウを表示したいと思っています。 今のところ、下記のように実装しましたがローカルで実行した際に、サイズを取得できない場合があります。 (document.write(size);で、width=0,height=0 と返ってくる) また、サーバ上で実行するとブラウザが応答なしになってしまいます…。 どのように解決すればよいか、良い案がありましたら是非ご教授下さい。 宜しくお願い致します。 function popup_img(url, title){ var tImg = new Image(); tImg.src = url; x = tImg.width; y = tImg.height; document.write(size);  //for debug if(x!=0 && y!=0){ var size = "width=" + x + ", height=" + y; a = window.open("","",size); a.document.write("<HTML>\n"); a.document.write("<TITLE>",title,"</TITLE>\n"); a.document.write("<BODY TOPMARGIN=0 LEFTMARGIN=0 MARGINHEIGHT=0 MARGINWIDTH=0>\n"); a.document.write("<IMG SRC=",url,">\n"); a.document.write("</BODY></HTML>\n"); a.document.close(); a.moveTo((a.screen.availWidth / 2 - tImg.width / 2), (a.screen.availHeight / 2 - tImg.height / 2)); } } // --> </SCRIPT> </head> <BODY> <a href="#" onClick="popup_img('TEST.jpg', 'SOME TITLE')">TEST</a>

  • <xml>タグを使った例

    つい先日も質問しましたが、具体例を記述したいと思います。 HTMLは以下の感じです。 <form name="frm"> <a href="#" onclick="javascript:call('test');">リンク</a> <xml id="includeXls"> <body scroll="no" style="margin:0 0 0 0"> <iframe name="fra1" src='2.html' height=100% width=100%> </body> </xml> </form> <script language="javascript"> <!-- function call(did){ var arg = "resizable=1,scrollbars=0,width=600,height=480,toolbar=1,menubar1=,directories=0,status=0"; var subWin; if (subWin != null) { if (!subWin.closed) { subWin.close(); } } subWin = window.open("", did, arg); subWin.document.open(); subWin.document.write(includeXls.innerHTML); subWin.document.close(); subWin.focus(); } //--> </script> これを適当な名前でhtmlを表示して、2.htmlという適当なhtmlを指定した「リンク」をクリックすると、 それが開きます。 このとき、<xml>タグを使わずに別のタグを使ってどうようなことができるのならそれを教えていただけたらと思います。 また、この<xml>タグはどういう意味になるのかも教えていただけたらと思います。 よろしくお願いします。

    • ベストアンサー
    • HTML
  • 親ウィンドウのボタンからサブウィンドウを閉じたいのですが・・・。

    いつもお世話になっています。 JavaScript初心者です。 window.closeについて質問させて下さい。 メインウィンドウにある「next」という次のページに移るボタンをクリックすると、開かれているサブウィンドウを閉じる処理を実行したいのですが、window.closeを使えばいいということしか分からず、何をどこに書けば良いのか困っています。(サブウィンドウにも「閉じる」ボタンを作成していますが、親ウィンドウからも操作が出来るようにしたいと思っています。) どうか教えていただけませんでしょうか。 ソースは次の通りです。 ----------------------------- //サブウィンドウの表示 <script language="JavaScript"> function sub(msg){ var page =window.open("", "HintPage","screenX=400,screenY=600,left=400,top=600,width=400,height=250,scrollbars=yes,resizable=yes"); page.document.open(); page.document.writeln("<html>"); page.document.writeln("<head><title>{test}</title></head>"); page.document.writeln("<body leftmargin=\"15\" rightmargin=\"15\" topmargin=\"20\">"); page.document.writeln("<h3>[ {test} ]</h3><hr><br>" + msg + "<br><br><hr><br>"); page.document.writeln("<div align=center>"); page.document.writeln("<input type=button value=close onclick=\"javascript:window.close()\"></div>"); page.document.writeln("</body>"); page.document.writeln("</html>\n"); page.document.close(); page.focus(); } </script> </HEAD> //「next」ボタンの表示 <body> <table cellpadding=3 cellspacing=5 align="right"> <tr> <td bgcolor="#9999ff" align="right"><input type="submit" name="next" value="{nextBtn}" style="width: 140px; height: 20.5px;" onClick="setPname('{next}')" {disabled2}></td></tr> </table> </body> ---------------------------- どうぞよろしくお願い致します。 説明不足の点がありましたら補足させて頂きます。

  • Microsoftのクリップギャラリーのように元サイズのプレビューを新しいウインドウに表示したい

    サムネイル画像をクリックすると、別ウインドウが開いて元サイズの画像を見せるページを作りたいんです。 サムネイルをクリックするたびに新しいwindowが次々に立ち上がるタイプのものは作れたのですが、別のサムネイルをクリックするとプレビュー用ウインドウの内容が変わるタイプのものが欲しいので困ってます。 サンプルを改造してみたのがこれです。 function tile(imgname){ win2=window.open("","","width=350,height=200,resizable=yes") if (win2){ win2.focus() win2.document.open() win2.document.write("<head><title>"+bgname+"</title></head>") win2.document.write("<body><img src="+'"'+imgname+'"'+">") win2.document.write("<TABLE WIDTH='100%' HEIGHT='100%'><TR><TD VALIGN='bottom' ALIGN='center'><FORM><INPUT TYPE='button' NAME='ok' VALUE='Close' onClick='window.close()'></FORM></TD></TR></TABLE>") win2.document.write("</body>") win2.document.close() } あと、サムネイル画像につけるリンク先HTMLファイルの書き方も良くわかりません。 スクリプトのほうに<head>と<body>タグがあるので<html>タグだけ書いておけば良いんでしょうか?

  • formについて

    JavaScriptを使ったアンケートについて <html> <head> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" /> <title>アンケート</title> <script type="text/javascript"> function Conf(){ a = document.forms[0].Email.value; if(a.match(/[a-zA-Z0-9_.]+@+[a-zA-Z0-9.]+$/)==null){ alert("間違っています"); } subWin=window.open("about:blank","form_data","width=300,height=300"); subWin.document.open(); subWin.document.write(a); subWin.document.close(); } </script> </head> <body> <form> <p>■メールアドレスを記入して下さい</p> <input type="text" name="Email" id="Email" size="40" /> <input type="button" value="確認" onClick="Conf()" /> </form> </body> </html> これだと、メルアドが間違っていますとalertが表示された後に、サブゥインドウが表示されてしまいます。 アンケートフォームを作りたくてJavaScriptを勉強中なのですが、メアドの入力が合っている場合のみサブゥインドウを表示させる方法が分からず、質問させて下さい。回答よろしくお願い申し上げます。

このQ&Aのポイント
  • 無自覚な性格の悪い友達との関係に悩んでいます。毒舌や態度の問題があり、話し合っても改善が見られません。私は彼女を傷つけたくないけど、一緒にいることが辛いです。
  • 友達の中に無自覚な性格の悪さを持つ子がいます。彼女は毒舌や態度で問題を引き起こし、話し合いでは改善が見られません。私は彼女を傷つけたくないけど、一緒にいることが辛いです。
  • 質問者は、無自覚な性格の悪い友達との関係に悩んでいます。友達は毒舌や態度で問題を引き起こし、話し合っても改善が見られません。彼女を傷つけたくないけど、一緒にいることが辛いです。
回答を見る

専門家に質問してみよう