18010 sujets

Questions générales et questions de débutants

Div caché sur hover [Resolu]

Bonjour bonjour,

Impossible d'y arriver alors je vous demande de l'aide Smiley sweatdrop

J'ai un div transparent qui cache une partie de mon site.
Au survol de ce div, j'aimerai qu'il disparaisse pour que l'on puisse cliquer ce qu'il y a en dessous.

Avec display:none sur un hover ça ne marche pas. Le div se met à clignoter.
Pareil sur un padding qui le décalerait.

Auriez-vous une solution ?

Merci de votre aide Smiley lol

Vicnent
Modifié par vmeyer (24 May 2013 - 12:49)
Bon, et bien j'ai fait ça en jquery:
$(function() {
$('#left_column').hover(function() {
$('#carre').hide();
}, function() {
$('#carre').show();
});
});

J'aurai préféré le faire en css Smiley decu
salut,
cacher un div lors de son survol est une chose pas trop possible à faire en CSS, vu que :hover s'applique lorsque l'on passe la souris sur l'élément mais si tu lui demandes de disparaître, il disparaîtra certes, mais dans ce cas la souris n'est plus sur l'élément et donc le hover ne s'applique plus. L'élément réapparaît alors mais si le curseur est toujours sur lui, alors il disparaîtra à nouveau, le curseur sera une nouvelle fois en dehors de l'élément et tu crée une sorte de boucle infinie (c'est pour cela qu'il clignote).
Une solution simple serait d'agir sur son parent, pour peu qu'il ait les mêmes dimensions et d'appliquer les règle au survol de son parent donc

<div id="parent">
	<div id="CacheToi"></div>
	<p>Ceci est du contenu...</p>
</div>



#parent {position:relative;width:200px;height:200px;border:1px solid #ccc;}
#CacheToi {position:absolute;width:100%;height:100%;z-index:1;background:#c00;opacity:.7;}
#parent:hover #CacheToi {display:none;}
Sujet clos
Aller à