2010-07-09 141 views
0

我有一個測試頁面:圖像,鼠標懸停,按鈕出現

http://www.youmethem.com/test/divdiv.html

我喜歡創造:

如果你將鼠標懸停在圖片中,黑色的按鈕,用文本和鏈接將出現。 如果用鼠標離開圖像,按鈕(帶有文本和鏈接)將會消失。

我該如何創建?它應該與IE6-7一起工作。

PS:我用這個,居中在圖像按鈕:CSS-垂直中心解決方案

更新:

關於Dobiatowski的回答是:

這裏是我的CSS解決方案(menue技術)。鏈接到最後的版本:link text

鼠標懸停工作正常,IE6和所有現代瀏覽器。但我有一些顯示錯誤。

有沒有辦法解決它們?

IE 8/9的所有現代瀏覽器(最佳)

IE 7(按鈕出現在正確的形象背後 - 錯誤)

IE 6(出現右圖像背後的按鈕,邊界破 - 錯誤)

回答

0

你可以在CSS或JavaScript中

的javascript做到這一點:

<img onmouseover="document.getElementById('div12').style.display = 'block';" 
onmouseout="document.getElementById('div12').style.display = 'none';" src='img.jpg'/> 

問題將出現在您將鼠標移到div上時,所以img fireup onmouseout事件。

+0

這裏是問題的解決方案http://www.quirksmode.org/js/events_mouse.html#mouseover – 2010-07-09 08:09:37