今天小編就為大家介紹dw制作鼠標(biāo)放上去圖片就顯示鼠標(biāo)離開圖片就消失的效果，操作方法很簡單的，不會(huì)的朋友可以參考本文哦！

操作步驟：

1、新建“HTML文檔”，在“布局”里找到“繪制層”，繪制一個(gè)方形層，填充顏色，并在里面輸入文字“夏”，字體和顏色，大家自由設(shè)置；

2、用“繪制層”再次繪制一個(gè)層，層編號(hào)設(shè)置為“夏”，寬：300px；高：200px；設(shè)置如圖所示：

3、在“夏”層里插入一張圖片，大小和“夏”層一樣大，寬和高分成設(shè)置為300px、200px；

4、點(diǎn)擊“窗口”—“行為”，出現(xiàn)“行為”窗口；

5、選中“夏”層，在“層”窗口下，打開“夏”前面的眼睛；然后選中文字“夏”，在“行為”窗口下，點(diǎn)擊，選擇“顯示—隱藏層”；

6、這時(shí)彈出“顯示—隱藏層”窗口，選中層“夏”，點(diǎn)擊“顯示”，然后確定即可；

7、在“行為”窗口中，就會(huì)出現(xiàn)“顯示—隱藏層”信息，在前面的下拉菜單中選擇“onMouseover  ”。

補(bǔ)充：onmouseover 事件會(huì)在鼠標(biāo)指針移動(dòng)到指定的對(duì)象上時(shí)發(fā)生。

8、再次選中“夏”層，在“層”窗口下，選擇“夏”前面的這個(gè)圖標(biāo)，它的意思就是關(guān)閉圖片，這時(shí)你會(huì)看到，“夏”層以及里面的圖片都沒有了；

9、選中文字“夏”，在“行為”窗口下，點(diǎn)擊，選擇“顯示—隱藏層”；這時(shí)會(huì)彈出“顯示—隱藏層”窗口，選中層“夏”，點(diǎn)擊“隱藏”，然后確定即可；

10、在“行為”窗口中，再次出現(xiàn)“顯示—隱藏層”信息，在前面的下拉菜單中選擇“onMouseout  ”。

補(bǔ)充：onmouseout 事件會(huì)在鼠標(biāo)指針移出指定的對(duì)象時(shí)發(fā)生；

11、保存，預(yù)覽；

圖1：鼠標(biāo)放上去，圖片顯示；

圖1

圖2：鼠標(biāo)離開，圖片消失

圖2

以上就是dw制作鼠標(biāo)放上去圖片就顯示鼠標(biāo)離開圖標(biāo)就消失方法介紹，操作步驟并不是很難，但需要大家仔細(xì)一點(diǎn)，尤其在設(shè)置行為時(shí)要注意圖片的顯示和隱藏，好了，有興趣的朋友可以參考本文哦！

注：本篇文章系腳本之家依照真實(shí)經(jīng)歷原創(chuàng)，轉(zhuǎn)載請(qǐng)注明出處！

最新評(píng)論