滑鼠滑過圖片時變換成另一張圖特效

參考教學網址
http://lmcmultimedia.blogspot.tw/2012/04/02.html


原始語法如下：
<img src="http://farm8.staticflickr.com/7065/6868049716_15fc49cb6c_z.jpg"onmouseover="this.src='http://farm8.staticflickr.com/7195/6909391890_89b10a66c8_z.jpg';" onmouseout="this.src='http://farm8.staticflickr.com/7065/6868049716_15fc49cb6c_z.jpg';"width=640>

語法說明：

1. img src="xxx"是指瀏覽器一進入此頁就要出現的圖片。xxx是指圖片的位置網址。
2. 「onmouseover="this.src='xxx';''」，是指滑鼠移到這張圖片位置時，要換成另一張圖片。xxx是指要換成的圖片的位置網址。英文字很清楚的表示了：on（在） mouse（滑鼠） over（移過）。
3. 「onmouseout="this.src='xxx';"，是指滑鼠離開時，要出現的圖片。在此例，是同第一張出現的圖。
4. 這是利用視覺的誤差所形成的效果，用來說明圖片內容很好用。
5. 二張圖片的大小最好一樣，比較容易處理。請注意： 「；」分號及各種標點符號都要打對，才行。

範例


測試結果