bradeux
Messages postés1Date d'inscriptionmardi 3 mai 2005StatutMembreDernière intervention29 août 2010
-
29 août 2010 à 19:18
PetoleTeam
Messages postés3426Date d'inscriptionlundi 26 décembre 2005StatutMembreDernière intervention14 janvier 2011
-
3 sept. 2010 à 18:12
<SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript">
$(function() {
$('.bulle-infos').hide();
$('.img').hover(
function () {
$(this).next().fadeIn();
},
function () {
$(this).next().fadeOut();
});
});
</SCRIPT>
test
Seulement voila, comment faire pour que lorsque je survole le div bulle-infos, celui-ci reste ouvert?
Pour le moment si je quitte l'image, le div se referme.
J'aimerai qu'il reste afficher si je survole le div bulle-infos. (par contre qu'il se re-ferme bien si je quitte toute la zone (img + bulle-infos).
Une idée ?
Merci!!
A voir également:
Afficher un texte au survol de la souris javascript
PetoleTeam
Messages postés3426Date d'inscriptionlundi 26 décembre 2005StatutMembreDernière intervention14 janvier 201117 3 sept. 2010 à 18:12
Bonjour,
lu dans leur doc et traduit...
.hover( handlerIn(eventObject), handlerOut(eventObject) ) --------------------------
handlerIn (ObjetEvenement) une fonction à exécuter lorsque le pointeur de la souris entre dans l'élément.
---------------------------
handlerOut (ObjetEvenement) une fonction à exécuter lorsque le pointeur de la souris quitte l'élément.
...en gros il ne faut rien faire en sortant de ton img mais le faire en sortant de la zone
un petit exemple pour voir
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
* {
font-family : Verdana;
font-size : 13px;
}
div {
border : 1px solid #a0a0ff;
width : 400px;
height : 200px;
background-color : #e0e0f0;
padding : 10px;
}
.info {
background-color : #81bef7;
}
.info_bulle {
border : 1px solid #faac58;
background-color : #ffffe0;
width : 100px;
height : 100px;
}
</style>
<title>le titre</title>
</head>
Le texte qui affiche la bulle et la suite du texte...
Le texte de l'info Bulle
avec [# un lien]
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.js"></script>
<script type="text/javascript">
$(function(){
$(".info").hover(
//-- fonction pour le mouseover
function(){
//-- recup le div conteneur et affiche
$(this).parents("div:first").children('.info_bulle').fadeIn();
},
//-- fonction pour le mouseout
function(){
return(false);
}
);
});
$(function(){
var Obj = $("#D_MAIN");
Obj.children('.info_bulle').hide();
Obj.hover(
function(){ //-- fonction pour le mouseover
return(false);
},
function(){ //-- fonction pour le mouseout
$(this).children('.info_bulle').fadeOut();
}
);
});
</script>
</html>
voila j'ai eu un peu de temps pour regarder plus avant ton problème!