TOP /すぐに使えるJavaScript | 画像の拡大表示(IE5,NN6) |
---|
画像をクリックで表示して再度クリックで非表示。 表示された画像をクリックしても非表示になります。 | |
<img onclick="imgopen('拡大画像')" src="縮小画像" border="0"><script type="text/javascript"><!-- imgtop=100; //表示位置Y imgleft=250; //表示位置X //-------------------------------- document.write("<img id='image'src=''style='position:absolute;z_index:2;"); document.write("top:"+imgtop+";left:"+imgleft+";display:none;'"); document.write("onclick='imgopen(imgtemp)'title='クリックで閉じる'>"); imgobj=document.images.image; imgtemp=""; function imgopen(imgsrc){ if(imgtemp!=imgsrc){ imgtemp=imgsrc; imgobj.src=imgsrc; scrollImg(); imgobj.style.display="block"; }else{imgobj.style.display="none";imgtemp="";} } function scrollImg(){ if(document.all) imgobj.style.top=document.body.scrollTop+imgtop; else imgobj.style.top=pageYOffset+imgtop+"px"; } onscroll = scrollImg;/*himajin.moo.jp*/ // --></script> <img onclick="imgopen('03.jpg')" src="s03.jpg" border="0"> <br> <img onclick="imgopen('02.jpg')" src="s02.jpg" border="0">