這 DHTML 腳本是個展示系列圖像的好途徑。允許不同面積的 gif 或 jpg 圖像相容。

選擇一個圖像

圖像一 圖像二 圖像三 圖像四 圖像五

 

安裝：

步驟一  拷貝以下代碼貼在網頁的BODY範圍內需要展示圖像選擇器的部位。

<form name="dynamicselector">
<b>Select an Image</b><p>
<table border="0" width="100%" cellspacing="0" cellpadding="0" height="178">
<tr>
<td width="35%" valign="top" align="left">
<select name="dynamicselector2" size="5" onChange="generateimage(this.options[this.selectedIndex].value)">

<option value="tx1.gif">圖像一</option>
<option value="tx2.jpg">圖像二</option>
<option value="tx3.gif">圖像三</option>
<option value="tx4.gif">圖像四</option>
<option value="tx5.jpg">圖像五</option>
</select>
</td>
<td width="65%" valign="top" align="left"><ilayer id="dynamic1" width=100% height=178><layer id="dynamic2" width=100% height=178><div id="dynamic3"></div></layer></ilayer></td>
</tr>
</table>
</form>

數值5是選擇箱內的展現的選項數目。若數值少於所提供選擇的圖像總數，右邊將會自動出現滾軸。

圖像文件名稱 (綠色)可任由更換。圖像名稱 (褐色)是選擇箱內所展示的。

您可任意增減供選擇的圖像。

步驟二  拷貝以下代碼貼在緊跟上述代碼的</form>標記之後。

    
<script> var tempobj=document.dynamicselector.dynamicselector2 function generateimage(which){ if (document.all){ dynamic3.innerHTML='<center>Loading image...</center>' dynamic3.innerHTML='<img src="'+which+'">' } else if (document.layers){ document.dynamic1.document.dynamic2.document.write('<img src="'+which+'">') document.dynamic1.document.dynamic2.document.close() } else alert('You need NS 4 or IE 4 to view the images!') } function generatedefault(){ generateimage(tempobj.options[tempobj.options.selectedIndex].value) } if (document.all||document.layers){ if (tempobj.options.selectedIndex!=-1) window.onload=generatedefault } </script>

圖像必須與網頁置於同一個文件夾內。

 

就是如此簡單！
請享用