如何淡入一個div上懸停？

我想懸停在圖像上，並有一個div文本在其中淡入。簡單。如何淡入一個div上懸停？

旁註：我希望它可以通過CSS進行樣式化。（一種給定的。）另外，我嘗試使用一些例子，但我很匆忙，所以請和謝謝你。

2010-10-07 Darlene Conner

如果你使用jQuery，喜歡的東西：

$('element').hover(function() 
{ 
    $('div').animate({ 'opacity': 1 }); 
});

來源

2010-10-07 01:12:19 jps

如果你能，你會提供HTML也是如此，如果它不以多少。謝謝:) – 2010-10-07 01:15:42

試試這個： http://jsfiddle.net/2WYtS/

來源

2010-10-07 01:30:59 malckier

您也可以使用淡入（）和淡出（）方法。 Link

來源

2010-10-07 01:31:43 Dienekes

試試這個：

<div class="hover"> 
    <img src="http://www.google.com/intl/en_ALL/images/srpr/logo1w.png" alt="google" /> 
</div> 
<div class="fade" style="display:none"> 
    This text will Fade In and Out. 
</div> 

$(document).ready(function() 
{  
    $("div.hover").hover(
     function() { 
     $("div.fade").fadeIn('slow'); 
     }, 
     function() { 
     $("div.fade").fadeOut('slow'); 
     } 
    ); 
});

Sample code here

順便問一下，你怎麼想它是CSS風格化？

來源

2010-10-07 01:37:00 bla

我需要能夠風格的股利，但那很容易。 – 2010-10-07 01:42:08

很好的例子+1從我，但如何保持div可見當鼠標在淡出div？如果淡出div包含一些鏈接，它是沒有用的，因爲當鼠標不在父div中時它會關閉？ – Goran 2013-08-23 14:43:59

使用CSS你可以改變淡出使用不透明

嘗試這

.box{ 
    width: 180px; 
    text-align: center; 
    background-color: #fff; 
    padding: 5px 10px; 
    z-index: 10; 
    font-weight: bold; 
    color:#000; 
} 

.box:hover{ 
     opacity: 0.7; 
}

來源

2012-11-05 04:57:14

如何淡入一個div上懸停？

回答

相關問題