11548 sujets

JavaScript, DOM et API Web HTML5

Clignotement Jquery hover sur div

Bonjour à tous,

Bon bon, là je bloque alors qu'il faut que j'avance sur mon projet...

J'essaye de griser et faire apparaitre deux parties de ma page sous une image transparente en passant la souris dessus.
Problème, quand je passe la souris ça disparait mais quand je la bouge ça clignote Smiley rolleyes

J'ai un peu tout essayé mais j'avoue que je ne trouve pas, je me demande si cela ne vient pas du style de ma div ?

Voici mon code :


div#leftpart {
	position:absolute;
	background:url("../img/tpl/pictrans.png");
	width: 479px;
	height: 100%;
	z-index: 9999;
	top: 0;
	left: 3px;
}


$("#leftpart").hover(function(){
$(this).fadeOut();
	}, function() {
$(this).fadeIn();
});	


<div id="content">
	<div id="leftpart"></div>
        <div id="rightpart"></div>
	...


Merci d'avance pour votre aide Smiley bawling

Michael
Le problème persiste avec mouseover (qui d'ailleurs ne fonctionne pas avec mon JS ci-dessus), jai testé avec mouseenter et même problème Smiley sweatdrop
Je pense qu'à la fin du fadeOut, comme le div est caché, le mouseleave est déclenché. Ce qui provoque le clignotement.
Ok, je viens donc de comprendre, lorsque la div disparait ma souris n'est forcement plus dessus, mais mon problème est que j'ai un bouton sous cette div et donc si je ne fais que la cacher le bouton lui devient non-cliquable Smiley decu

Bon bon, je crains qu'il me faille penser autrement Smiley rolleyes
Lemim a écrit :
Ok, je viens donc de comprendre, lorsque la div disparait ma souris n'est forcement plus dessus, mais mon problème est que j'ai un bouton sous cette div et donc si je ne fais que la cacher celui-ci devient non-cliquable Smiley decu

Bon bon, je crains qu'il me faille penser autrement Smiley rolleyes
salut, je pense avoir trouvé une solution pour ton problème de clignottement.
	$("#gauche").on("mouseenter", function () { $(this).animate({opacity:0}, {duration:1000, easing:"linear"});	});
	$("#gauche").on("mouseleave", function () { $(this).animate({opacity:1}, {duration:1000, easing:"linear"});	});

J'ai constaté aussi le même phénomène que toi. J'ai cherché sur le net en essayant plusieurs solutions. Celle de l'opacité fonctionne bien.
Modifié par tournikoti (18 Jun 2012 - 19:37)
Sujet clos
Aller à