※ ChatGPTを利用し、要約された質問です(原文:htmlで[close]ボタンで拡大表示した写真を閉じるには)
htmlで写真を拡大表示して閉じる方法
このQ&Aのポイント
ホームページ作成ソフトを持っていない場合でも、エディターを使って自分のホームページを作成することができます。
写真を縮小表示しておき、クリックするとその写真が拡大表示されるようにする方法もあります。
拡大表示された写真は、上部に表示され、閉じるボタンをクリックすることで元の画面に戻ることができます。
htmlで[close]ボタンで拡大表示した写真を閉じるには
ホームページ作成ソフトは持っていません、エディターで「しこしこ」自分のささやかなホームページを作っています。
今は次のような文で横2列、縦10行で20枚の写真を縮小表示して、その写真をクリックすると拡大表示されるようにしています。
その拡大表示は別画面になって表示され、左上の「戻る」か「BackSpace」を押すと元の縮小表示している画面に戻ります。
<tr>
<td nowrap align="center">
<a href="images/FW090327.JPG">
<img src="images/FW090327.JPG" border="0" width="350" alt="カタツムリのたまご"></a><br>
<FONT size="+1"><b>カタツムリのたまご<br>2009/3</FONT></b></td>
<td nowrap align="center">
<a href="images/FW090502.JPG">
<img src="images/FW090502.JPG" border="0" width="350" alt="ミニチュアタイプのカタツムリ"></a><br>
<FONT size="+1"><b>ミニチュアタイプのカタツムリ<br>2009/5</FONT></b></td>
</tr>
拡大写真を別画面に表示するのでなく、良くホームページで見かけるような今の画面の上に拡大表示され、[close]でその写真を閉じるような感じです。
縮小表示している写真をクリックすることにより、縮小表示している画面の上にその写真が拡大表示され、その拡大表示された写真の右下に[close]ボタンが表示され、[close]ボタンで拡大表示された写真を閉じることができ、縮小表示されている画面になるようにしたいのです。
htmlについては極初心者です、なにか良い方法がありましたら教えていただきたいのです、よろしくお願いいたします。
お礼
Lightbox2とJavaScriptとライブラリを手がかりにして色々調べて見ました。 ウィンドウのサイズを変更できるようにしたポップアップウィンドウを開くというJavaScriptのfunction function win_open2(wIMG,wName,wWidth,wHeight) にたどり着きました。 初めてトライする時に、さがすのに必要なキーワードを教えていただくのがいかに大切かを痛感しました。 ありがとうございました。