商品詳細内容が入ります／<br>
複数商品画像のポップアップ画面のソースをコピーし、【商品管理】&gt;【商品の設定】&gt;【商品の登録/修正】「商品詳細内容入力」にペーストしたテスト<br>
<a href="" target="_blank">「商品詳細内容入力」にペーストしたソースはこちら</a>
<style type="text/css">
table#M_imageCatalog {
    border-collapse: collapse;
}

table#M_imageCatalog td {
    border: solid 1px #dadada;
    width: 80px;
    height: 80px;
    text-align: center;
}</style>
<table width="500">
<tbody>
<tr>
<td align="center" height="423" width="390">
<img border="0" id="M_image0_display" src="http://gigaplus.makeshop.jp/designdemo03/shopimages/1_022000000007.jpg" style="display:block"> <img border="0" id="M_image1_display" src="http://gigaplus.makeshop.jp/designdemo03/shopimages/2_022000000007.jpg" style="display:none"> <img border="0" id="M_image2_display" src="http://gigaplus.makeshop.jp/designdemo03/shopimages/3_022000000007.jpg" style="display:none"> <img border="0" id="M_image3_display" src="http://gigaplus.makeshop.jp/designdemo03/shopimages/4_022000000007.jpg" style="display:none"> <img border="0" id="M_image4_display" src="http://gigaplus.makeshop.jp/designdemo03/shopimages/5_022000000007.jpg" style="display:none"></td>
<td valign="top">
<table id="M_imageCatalog">
<tbody>
<tr>
<td>
<a href="javascript:void(0);" id="M_image0"><img border="0" src="http://gigaplus.makeshop.jp/designdemo03/shopimages/s1_022000000007.jpg"></a></td>
</tr>
<tr>
<td>
<a href="javascript:void(0);" id="M_image1"><img border="0" src="http://gigaplus.makeshop.jp/designdemo03/shopimages/s2_022000000007.jpg"></a></td>
</tr>
<tr>
<td>
<a href="javascript:void(0);" id="M_image2"><img border="0" src="http://gigaplus.makeshop.jp/designdemo03/shopimages/s3_022000000007.jpg"></a></td>
</tr>
<tr>
<td>
<a href="javascript:void(0);" id="M_image3"><img border="0" src="http://gigaplus.makeshop.jp/designdemo03/shopimages/s4_022000000007.jpg"></a></td>
</tr>
<tr>
<td>
<a href="javascript:void(0);" id="M_image4"><img border="0" src="http://gigaplus.makeshop.jp/designdemo03/shopimages/s5_022000000007.jpg"></a></td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<script>
window.onload = function(){
	window.moveTo(5, 5);
		window.resizeTo(260 + 250, 425 + 170);
		
    for(var i=0; i<5; i++){  
                document.getElementById('M_image' + i).onmouseover = updateImage;  
            }
}

function updateImage(){
    for(var i=0; i<5; i++){  
        document.getElementById('M_image' + i + '_display').style.display = 'none';
    }
    document.getElementById(this.id + '_display').style.display = 'block';
}
</script>