文字リンクから画像「だけ」を別窓で出す方法を忘れてしまいました。是非お教え願います。

 ちなみに、htmlに画像を貼って、画像の大きさで別窓を出す方法ではなく、純粋に画像だけを表示させる方法です。

回答の条件
  • URL必須
  • 1人2回まで
  • 登録:2004/03/01 00:08:33
  • 終了:--

回答(17件)

id:inokuni No.1

いのくに回答回数1343ベストアンサー獲得回数212004/03/01 00:12:03

ポイント10pt

HTML の A タグの HREF に画像の SRC を指定して、

その A タグの TARGET を _blank に指定すればいいのだと思います。

例 <A HREF=”img.jpg” TARGET=”_blank”>文字</A>

id:shinobu

 試してみましたが、残念ながら出来ませんでした。

確か前にやっていた方法はJAVAスクリプトでした。

2004/03/01 00:20:23
id:toshitoshi No.2

toshitoshi回答回数34ベストアンサー獲得回数02004/03/01 00:21:36

ポイント10pt

<A HREF=”

” TARGET=”_blank”>クリック</A>

このことですか?

id:shinobu

ごめんなさい、これも今試してみましたが、出来ませんでした。

2004/03/01 00:26:26
id:mixsa No.3

mixsa回答回数24ベストアンサー獲得回数02004/03/01 00:22:19

ポイント10pt

<a href=”画像ファイル名” target=”_blank”>文字リンク文</a>

…で、いいんじゃないのでしょうか?

もし、メニューバーやスクロールバーなどもない状態にしたり、

ウインドウ枠の大きさも調整するのであれば、

JavaScriptで制御する必要があるかと思います。

id:takeos No.4

takeos回答回数26ベストアンサー獲得回数02004/03/01 00:35:28

ポイント10pt

1.2ができないのはおかしいですね。ごく普通です。

javascriptでメニューとかステータスバーを出したくないら 

とかをごらんになればどうでしょう。

id:shinobu

 出来なかったのは、アップロードせずにローカルでチェックしてたからかもしれません( ;^^)ヘ..

 ご紹介くださったトホホも、質問前に読んではあったのですが、自分ではちょっとよくわからなかったので、そのものズバリの方法が知りたいのです。

 質問の仕方が紛らわしくて申し訳ありませんでした。

2004/03/01 00:45:15
id:nogoochi No.5

nogoochi回答回数2ベストアンサー獲得回数02004/03/01 00:40:43

ポイント10pt

以下の方法でどうでしょう?

<A href=”

” onClick=’window.open(this, ”_blank”);return false;’>はてな</A>

id:shinobu

やってみましたが飛んだ先が「http://Myアカウント.web.infoseek.co.jp/”http://www.hatena.ne.jp/images/hatena.gif”」となってしまい、404 Not Foundとなってしまいました。

 JAVAスクリプトでのご解答を希望します。

2004/03/01 00:48:57
id:mixsa No.6

mixsa回答回数24ベストアンサー獲得回数02004/03/01 00:41:40

ポイント20pt

<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>

以上をそのまま使って見てください。動作確認しました。

id:shinobu

 出来ました。有難う御座います。

ただ、これを自分のサイトでやってみたところ、窓のサイズ指定もちゃんと変更してあるのに、上と左に余白が出来てしまうんですよね。何故でしょう・・・?

2004/03/01 01:00:48
id:abhrsh No.7

abhrsh回答回数4ベストアンサー獲得回数02004/03/01 01:07:38

ポイント10pt

1,2の方法でできると思います。

ただ、例で記述しているタグの中で「”」が全角で表示されてしまっているのでこれを半角に置き換えて試してみてください。

id:shinobu

 えっと、画像の大きさ=窓の大きさで、メニューバー等が一切表示されない方法が知りたいのです。

半角にしなかったのは、先ほど解答してくださった方ので一回上手く行かなかったので気付きました。ごめんなさい( ;^^)ヘ..

2004/03/01 01:11:44
id:abhrsh No.8

abhrsh回答回数4ベストアンサー獲得回数02004/03/01 01:29:42

ポイント10pt

上と左に余白がでてしまうのを解決するには、

ウインドウを開くときに画像(xxx.jpgなど)を直接開かずに、このようなHTMLファイルを作ってそれを開いてみてください。

<html>

<head>

<title>画像表示ウインドウ</title>

</head>

<body style=”margin: 0px;”>

<img src=”画像のURL”>

</body>

</html>

id:shinobu

 質問にはありますが、「htmlファイルにせず」に画像に直接するリンクで、Javaスクリプトを利用した方法を探しております。

以前にやっていた方法なので、存在しないはずはないので・・・

 申し訳御座いません。

2004/03/01 01:32:11
id:miyano_hal No.9

miyano_hal回答回数3ベストアンサー獲得回数02004/03/01 02:29:09

ポイント15pt

<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以外では使用できるかは不明ですが。

以前私も使ってましたので。

id:cu39 No.10

cu39回答回数5ベストアンサー獲得回数02004/03/01 03:08:00

ポイント10pt

<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ピクセル以下?)だとなぜか余白ができますが、それ以外は余白なく表示されています。

id:shinobu

半角部分を修正してからやってみましたが、何故かウィンドウは出るのに画像が表示されませんでした。

一体ドコが悪かったのでしょう・・・(==;

2004/03/01 11:51:35
id:Yanbou1963 No.11

Yanbou1963回答回数1ベストアンサー獲得回数02004/03/01 05:19:48

ポイント15pt

テストページを作ってみました。「参考URL」のページに行ってみてください。

こんな感じで良ければ、そのまま「ソース」を表示されて、アレンジなど加えてみてください。

では。

id:shinobu

拝見させていただきました。

残念ながら画像の周りに余白があったので、この方法ではなかったようです。

テストページまで作っていただいて有難う御座いました。

2004/03/01 11:53:44
id:inthegroove No.12

inthegroove回答回数768ベストアンサー獲得回数62004/03/01 13:43:35

ポイント15pt

<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>

ずばりこれでしょう。どうでしょうか?

id:shinobu

 この方法もいいですね。

でも、知りたいのはマウスオーバーで同じページに表示ではなく、「画像だけが画像サイズで別窓表示」の方法なんです。

でも、この方法も機会があったらつかわせていただきますね。ありがとうございます。

2004/03/02 18:11:33
id:green_lab No.13

green_lab回答回数11ベストアンサー獲得回数02004/03/01 14:10:11

ポイント15pt

10の方の回答でばっちりだと思います。

なお、全角から半角に戻す文字は、「’」「”」「¥」の3つです。

id:shinobu

出来ました!

「¥」も半角にしなければならないのを見落としていました。

的確な指摘、有難う御座いました ペコリ(o_ _)o))

2004/03/02 18:21:31
id:ymch No.14

やちまう回答回数36ベストアンサー獲得回数52004/03/01 15:24:53

ポイント15pt

10.の cu39 さんのやり方で完璧です。

半角に直すのは…

…だけではなくて…

…もですよ〜。

id:shinobu

ご指摘通り修正したら出来ました。

有難う御座いました ペコリ(o_ _)o))

2004/03/02 18:22:13
id:cu39 No.15

cu39回答回数5ベストアンサー獲得回数02004/03/01 16:40:39

ポイント10pt

回答でのフォローになることをお許しください。

「ウィンドウは出るのに画像が表示されない」状態というのが、「画像がみつからない」(画像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使用もアウトなんでしょうか?)。

id:shinobu

 画像が出ないのは、やはり「¥」を全角のままにしていたからだったので、右クリックでも表示されませんでした。

 マージン0の件ですが、これは普段からCSSで指定していますので、大丈夫です。

ありがとうございました。

2004/03/02 22:22:11
id:andymente No.16

andymente回答回数96ベストアンサー獲得回数02004/03/01 17:35:59

ポイント15pt

ためしに今組んでみました。

スクリプト部分は以下の通りです。

<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>

のようにリンクを張れば別窓で表示されるはずです。

id:shinobu

これでもいいですね。わざわざ新たに組んで頂いて有難う御座いました ペコリ(o_ _)o))

2004/03/02 22:30:47
id:etecarino No.17

etecarino回答回数34ベストアンサー獲得回数12004/03/02 00:02:20

ポイント15pt

チョット亜流ですが、

<a href=”javascript:void(0)” onClick=”window.open(’画像URL’,’subwin’,’width=画像横幅ピクセル,height=画像縦幅ピクセル’);”>ここをクリック</a>

というのはいかがでしょう?ただし、画像の縦横幅をそのまま入れてしまうと、何故か上下に空白ができてしまいます。何故かは分かりません(すいません…)なので、10〜20ピクセルほど小さめに指定してやるとうまくいきますが……。

それから、Mac・IE以外では確認していませんので、ご了承を。

id:shinobu

ありがとうございます。

レンタル日記等、ヘッダーに埋め込みが出来ない時等に試してみますね。

2004/03/02 22:39:47

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません