2011-04-20 164 views
3

一旦用戶懸停在按鈕上,我需要顯示一個額外的圖像。你怎麼去做這個理想的使用CSS。CSS懸停效果

當用戶懸停在宣傳冊按鈕上時,您可以看到我需要的圖片,視圖小冊子按鈕出現。

enter image description here

+0

簡短的回答'.button:懸停.view-小冊子{顯示:塊}'我們真的需要HTML – JohnP 2011-04-20 11:31:57

回答

5

與CSS獨自一人,如果你可以把一個元素懸停對象的內部,你可以這樣做:

小提琴這裏:http://jsfiddle.net/Q67hB/

html:

<div id="one">all the time 
    <div id="two">only on hovering one</div> 
</div> 

CSS:

#two{ 
    display: none; 
} 
#one:hover #two{ 
    display: block; 
} 
+0

感謝您的易於使用,並解釋得很好的答案:)欣賞 – 2011-04-20 11:44:48

0

在CSS

button:hover { 
    background-image: url(someImage.png); 
} 
+0

我不記得很清楚,但我認爲這不會(總是)在Internet Explorer中工作。所以你應該測試它! – Fortega 2011-04-20 11:35:14

+0

除此之外,另一個答案是更好的,尤其是定位和玩耍。 – 2011-04-20 11:45:16