雖然在滑鼠移到連結時,
游標會變成手勢,
但是畫面上若無任何變動,總覺得不夠直覺,
所以一直以來寫網頁的習慣,
從加底線到文字換色再到換文字背景底色...
但有時按鈕或者畫面上的連結,是一張圖片,
在公司的網頁上很常見,
而使用DreameWeaver所用的JavaScript又相當的肥大,
後來找到了一個簡單的語法,可以達到一樣的效果,
而且有多個連結多張圖片,一樣可以使用,
(預載圖片的部份請另外在body裡加載onload)
語法的使用如下:
1.在</head>之前加上簡單的script
<script> function over(imgObj,picname) { imgObj.src=picname; } function out(imgObj,picname) { imgObj.src=picname; } </script>
2.在圖片上增加onmouseover及onmouseout的參數
<img onmouseover="over(this,'menu1s.jpg')" onmouseout="out(this,'menu1.jpg')" src= "menu1.jpg" style="cursor:hand">
多個連結時,
只要重覆2的圖片語法,更改圖片即可!
當然不一定要連結,只要希望在游標移過時會切換圖片,都可使用此語法!
打完收工!