livedoor ナレッジ

ポップアップの画像をマウスクリックでクローズさせるには？

過去のナレッジでは探しきれませんでしたので、
質問させていただきます。

ブログ記事中のサムネール画像をクリックすると、
新たにウィンドウが開き、大きな画像が表示されます。

質問はこのポップアップウィンドウのクローズ動作についてなのですが；

毎回「alt+F4」かウィンドウ右上の「X」で閉じるのではなく、画像のクリックで閉じるようにするにはどのようにすれば良いでしょうか？

私のブログは、

になります。

ご教授くださいますよう、宜しくお願いいたします。

#3>エラー；アクセスが拒否されました。
すみません、このエラーは、別のサイトを表示しているウインドウにアクセスしようとしているというようなエラーです。
スクリプトを投稿した時の質問者のサイトでは、画像ファイルが自サイトにあったので、よかったのですが、ライブドアのような別サイトアドレスになっている場合（ＩＥでは）このようなエラーがでます。

var newWin=window.open(url, name, "resizable=yes,width=" + w + ",height=" + h );

となっている部分を

var newWin=window.open("", name, "resizable=yes,width=" + w + ",height=" + h );

のように変更下さい。
配慮が足りませんでした。
申し訳ございません。

ライブドアのサムネイルは、画像ファイルをブラウザに表示させるだけのものなので、画像のクリックで閉じるようにするのは無理です。
ただし、サムネイルをクリックした時に、スクリプトで別に開いたブラウザで表示するようにすることでそのような機能を盛り込むことは可能です。

例えば、
http://knowledge.livedoor.com/32195
の

newWin.document.write('<img src="'+ url + '" alt="' + alt + '"\/>');

を

newWin.document.write('<img src="'+ url + '" alt="' + alt + '" onclick="window.close()"\/>');

に変更すれば事足りると思います。

#1>他に、留意すべき点などございますでしょうか・・？
回答２リンク先の回答１にも書いていますけど、画像部分にonclick でスクリプトを呼び出す必要があります。
例えば、
（シンプルエディタになってない場合は、シンプルエディタで作業下さい）

<A href="http://image.blog.livedoor.jp/ex44spl/imgs/6/0/60a17653.JPG" target=_blank><IMG class=pict height=753 alt=DSC_0073 hspace=5 src="http://image.blog.livedoor.jp/ex44spl/imgs/6/0/60a17653-s.JPG" width=500 align=left border=0></A>

の様になっている部分ですが、

<IMG class=pict height=753 alt=DSC_0073 hspace=5 src="http://image.blog.livedoor.jp/ex44spl/imgs/6/0/60a17653-s.JPG" width=500 align=left border=0 onclick='openImage("http://image.blog.livedoor.jp/ex44spl/imgs/6/0/60a17653.JPG");' style="cursor:pointer">

の様に変更下さい。
リンク指定をはずして、開く画像ファイルＵＲＬをopenImage( ) に指定してクリックされた時に開くファイルを指定しています。

style="cursor:pointer"

の部分は、リンクと同じようにカーソル形状を変化させます。

貴ブログの場合、サムネイルによるサイズの縮小を使っていないようなので、
そのような場合は、

<IMG class=pict height=753 alt=DSC_0073 hspace=5 src="http://image.blog.livedoor.jp/ex44spl/imgs/6/0/60a17653.JPG" width=500 align=left border=0 onclick='openImage(this);' style="cursor:pointer">

のように、元画像の-s を取り除いて（あるいはファイルのアップロード時にサムネイルを作成しないでアップロードして）やれば画像ファイルＵＲＬの代わりにthis が使用できます。