Comment faire pour se faner dans un div en stationnaire?

Question

Je veux placer un pointeur sur une image, et avoir un div avec du texte pour qu'il apparaisse. Simple.

Sidenote: Je veux qu'il soit stylisé par CSS. (Un peu d'un donné.) Aussi, j'ai essayé d'utiliser quelques exemples mais je suis pressé donc s'il vous plaît et merci.

Answer 1

Si votre utilisation de jQuery, quelque chose comme:

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

Answer 2

Essayez ceci: http://jsfiddle.net/2WYtS/

Answer 3

Vous pouvez également utiliser les méthodes fadeIn() et fadeOut(). Link

Answer 4

Essayez ceci:

<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

D'ailleurs, comment voulez-vous qu'il soit CSS stylable?

Answer 5

L'utilisation de CSS Vous pouvez modifier fondu à l'aide d'opacité

essayer cette

.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; 
}