ちなみに、htmlに画像を貼って、画像の大きさで別窓を出す方法ではなく、純粋に画像だけを表示させる方法です。
HTML の A タグの HREF に画像の SRC を指定して、
その A タグの TARGET を _blank に指定すればいいのだと思います。
例 <A HREF=”img.jpg” TARGET=”_blank”>文字</A>
ごめんなさい、これも今試してみましたが、出来ませんでした。
<a href=”画像ファイル名” target=”_blank”>文字リンク文</a>
…で、いいんじゃないのでしょうか?
もし、メニューバーやスクロールバーなどもない状態にしたり、
ウインドウ枠の大きさも調整するのであれば、
JavaScriptで制御する必要があるかと思います。
1.2ができないのはおかしいですね。ごく普通です。
javascriptでメニューとかステータスバーを出したくないら
とかをごらんになればどうでしょう。
出来なかったのは、アップロードせずにローカルでチェックしてたからかもしれません( ;^^)ヘ..
ご紹介くださったトホホも、質問前に読んではあったのですが、自分ではちょっとよくわからなかったので、そのものズバリの方法が知りたいのです。
質問の仕方が紛らわしくて申し訳ありませんでした。
以下の方法でどうでしょう?
<A href=”
” onClick=’window.open(this, ”_blank”);return false;’>はてな</A>
やってみましたが飛んだ先が「http://Myアカウント.web.infoseek.co.jp/”http://www.hatena.ne.jp/images/hatena.gif”」となってしまい、404 Not Foundとなってしまいました。
JAVAスクリプトでのご解答を希望します。
<html>
<head>
<title>画像を別窓で表示</title>
</head>
<script language=”JavaScript” type=”text/javascript” >
<!--
function popup(url)
{
window.open(url,”image”,”width=675,height=60,scrollbars=no,status=no,location=no,toolbar=no,menubar=no,resizable=no,left=8,top=16”);
}
// -->
</script>
<body>
<A href=”JavaScript:popup(’
’);”>ここをクリック</A>
</body>
</html>
以上をそのまま使って見てください。動作確認しました。
出来ました。有難う御座います。
ただ、これを自分のサイトでやってみたところ、窓のサイズ指定もちゃんと変更してあるのに、上と左に余白が出来てしまうんですよね。何故でしょう・・・?
1,2の方法でできると思います。
ただ、例で記述しているタグの中で「”」が全角で表示されてしまっているのでこれを半角に置き換えて試してみてください。
えっと、画像の大きさ=窓の大きさで、メニューバー等が一切表示されない方法が知りたいのです。
半角にしなかったのは、先ほど解答してくださった方ので一回上手く行かなかったので気付きました。ごめんなさい( ;^^)ヘ..
上と左に余白がでてしまうのを解決するには、
ウインドウを開くときに画像(xxx.jpgなど)を直接開かずに、このようなHTMLファイルを作ってそれを開いてみてください。
<html>
<head>
<title>画像表示ウインドウ</title>
</head>
<body style=”margin: 0px;”>
<img src=”画像のURL”>
</body>
</html>
質問にはありますが、「htmlファイルにせず」に画像に直接するリンクで、Javaスクリプトを利用した方法を探しております。
以前にやっていた方法なので、存在しないはずはないので・・・
申し訳御座いません。
<a href=”javascript:w=window.open(’’,’’,’scrollbars=no,status=no,location=no,toolbar=no,menubar=no,resizable=no’);w.document.write(’<html><body leftmargin=0 topmargin=0 marginwidth=0 marginheight=0><img src=
’)”>test</a>
これではアカン?
荒業なので、IE以外では使用できるかは不明ですが。
以前私も使ってましたので。
<html>
<head>
<title>画像を別窓で表示</title>
</head>
<script language=”JavaScript” type=”text/javascript”>
<!--
function popup(url,myWidth,myHeight)
{
mySize = ”width=” + myWidth + ”,height=” + myHeight + ”,scrollbars=no,status=no,location=no,toolbar=no,menubar=no,resizable=no,left=8,top=16”;
myWindow = window.open(””,”image”,mySize);
myWindow.document.open();
myWindow.document.write(’<html><head>’);
myWindow.document.write(’<title>’ , url , ’<’,’/title>’);
myWindow.document.write(’<’,’/head>’);
myWindow.document.write(’<body topmargin=0 leftmargin=0 marginheight=0 marginwidth=0><img src=¥”’ , url , ’¥”><’ , ’/body><’ , ’/html>’);
myWindow.document.close();
}
// -->
</script>
</head>
<body>
<a href=”JavaScript:popup(’
’,’134’,’93’);”>ここをクリック</a>
</body>
</html>
6 を改造させていただきました。私の環境では、あまり小さいサイズの画像(100ピクセル以下?)だとなぜか余白ができますが、それ以外は余白なく表示されています。
半角部分を修正してからやってみましたが、何故かウィンドウは出るのに画像が表示されませんでした。
一体ドコが悪かったのでしょう・・・(==;
テストページを作ってみました。「参考URL」のページに行ってみてください。
こんな感じで良ければ、そのまま「ソース」を表示されて、アレンジなど加えてみてください。
では。
拝見させていただきました。
残念ながら画像の周りに余白があったので、この方法ではなかったようです。
テストページまで作っていただいて有難う御座いました。
<html>
<a onmouseover=”txt1.style.display=’block’”
onmouseout=”txt1.style.display=’none’”><u><b>画像表示</b></u></a>
<span id=”txt1” style=”display:none;position:absolute;
border:1px dotted red;color:#818181;background-color:white;”>
<img src=”画像のファイル名”>
</span>
</html>
ずばりこれでしょう。どうでしょうか?
この方法もいいですね。
でも、知りたいのはマウスオーバーで同じページに表示ではなく、「画像だけが画像サイズで別窓表示」の方法なんです。
でも、この方法も機会があったらつかわせていただきますね。ありがとうございます。
出来ました!
「¥」も半角にしなければならないのを見落としていました。
的確な指摘、有難う御座いました ペコリ(o_ _)o))
10.の cu39 さんのやり方で完璧です。
半角に直すのは…
’
”
…だけではなくて…
¥
…もですよ〜。
ご指摘通り修正したら出来ました。
有難う御座いました ペコリ(o_ _)o))
回答でのフォローになることをお許しください。
「ウィンドウは出るのに画像が表示されない」状態というのが、「画像がみつからない」(画像URLが間違っている)状態などであれば、開いた窓の中で「右クリック→ソースの表示」してソースを確認することで問題がわかるかもしれません。別窓を右クリックしてもメニュー内に「ソースの表示」が出てこなければ resizable=yes として別窓のサイズ変更を可能にし、窓を広げてから余白を右クリックすることで出てくると思います(IEの場合)。
一例として、
myWindow.document.write(’<body topmargin=0 leftmargin=0 marginheight=0 marginwidth=0><img src=¥”’ , url , ’¥”><’ , ’/body><’ , ’/html>’);
↓
myWindow.document.write(’<body topmargin=0 leftmargin=0 marginheight=0 marginwidth=0><img src=’ , url , ’><’ , ’/body><’ , ’/html>’);
としてみたらどうなるでしょうか? あとはシングルクォートとダブルクォートがすべて半角になっていれば、動作するはずだと思うのですが……これでダメならあきらめます。
ちなみに、「<body topmargin=0 leftmargin=0 marginheight=0 marginwidth=0>」で指定しているマージンは、CSSと併用するか、置き換えてしまうほうが汎用性が高まるかと思います。JavaScript で一時的なHTMLドキュメントを生成していますので、適宜タグを変更してください(もしかして、このHTML使用もアウトなんでしょうか?)。
画像が出ないのは、やはり「¥」を全角のままにしていたからだったので、右クリックでも表示されませんでした。
マージン0の件ですが、これは普段からCSSで指定していますので、大丈夫です。
ありがとうございました。
ためしに今組んでみました。
スクリプト部分は以下の通りです。
<script type="text/javascript">
<!--
function img_ppup(file) {
var img = new Image();
img.onload = function() {
img_win = window.open("","","width=" + this.width + ",height=" + this.height +
",scrollbars=no,status=no,location=no,toolbar=no,menubar=no");
img_win.document.open();
img_win.document.write('<img src=¥"' + this.src + '¥">');
img_win.document.close();
img_win.document.body.style.margin = "0px";
}
img.src = file;
}
//-->
</script>
<a href="javascript:img_ppup('
);">はてな</a>
のようにリンクを張れば別窓で表示されるはずです。
これでもいいですね。わざわざ新たに組んで頂いて有難う御座いました ペコリ(o_ _)o))
チョット亜流ですが、
<a href=”javascript:void(0)” onClick=”window.open(’画像URL’,’subwin’,’width=画像横幅ピクセル,height=画像縦幅ピクセル’);”>ここをクリック</a>
というのはいかがでしょう?ただし、画像の縦横幅をそのまま入れてしまうと、何故か上下に空白ができてしまいます。何故かは分かりません(すいません…)なので、10〜20ピクセルほど小さめに指定してやるとうまくいきますが……。
それから、Mac・IE以外では確認していませんので、ご了承を。
ありがとうございます。
レンタル日記等、ヘッダーに埋め込みが出来ない時等に試してみますね。
試してみましたが、残念ながら出来ませんでした。
確か前にやっていた方法はJAVAスクリプトでした。