Petit souci mouseover/mouseout avec Jquery

par **moileraz** » 19 oct. 2009, 13:02

Bonjour est ce que c'est possible de faire quelques choses comme ca :

<script type="text/javascript">

$(document).ready(function() {
$('.dhtml').each(function(){
$(this).parent().hover(
function(){
$(this).children('.container').children('.dhtml').show();
},
function(){
$(this).children('.container').children('.dhtml').hide();
});
});
});
</script>

car mon code html est comme ceci :

Code : Tout sélectionner

<div id="main_container">
 <table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td height="150px" valign="bottom" >
      <div class="container">
         <div class="titre" >
           <a href="liens.php" >LIENS</a></div>
          <div class="dhtml" style="display:none;">Ici mon text de description</div>
</div>
    </td>
  </tr>
</table>
</div>

merci pour ton aide

par **moileraz** » 13 oct. 2009, 18:15

Super ca marche

par **Cobaye** » 13 oct. 2009, 18:11

essaie avec :

<script type="text/javascript">

$(document).ready(function() {
$('.dhtml').each(function(){
$(this).parent().hover(
function(){
$(this).children('.dhtml').show();
},
function(){
$(this).children('.dhtml').hide();
});
});
});
</script>

ca exécutera le Js que quand la page sera chargé, car la le js se lance avant l'affichage de div

par **moileraz** » 13 oct. 2009, 18:07

Salut merci pour tes réponses,

j'ai écrit ca :

Code : Tout sélectionner

<html >
<head>

<title>Untitled Document</title>

<script type="text/javascript">
$('.dhtml').each(function(){
      $(this).parent().hover(
            function(){
               $(this).children('.dhtml').show();
            },
            function(){
               $(this).children('.dhtml').hide();
            });
   });
</script>
</head>

<body>
<div><a href="page.html" >Slide</a>;
<div id="div1" class="dhtml"  style="display:none;">Ici je met mon text</div></div>
</body>
</html>

Mais quand je passe ma souris y'a rien qui se passe. désolé mais j'ai encore beaucoup de mal avec Javascript. merci encore pour tes lumières

par **Cobaye** » 13 oct. 2009, 17:58

pas besoin

Code : Tout sélectionner

<div><a href="page.html" >Slide</a>;
<div id="div1" class="dhtml"  style="display:none;">Ici je met mon text</div></div>

Code : Tout sélectionner

$('.dhtml').each(function(){
      $(this).parent().hover(
            function(){
               $(this).children('.dhtml').show();
            },
            function(){
               $(this).children('.dhtml').hide();
            });
   });

}

ce que fait la fonction, elle recherche toutes les dhtml (avec la class .dhtml) puis se position sur le parent donc la le div principal et sur le hover (qui gère le mouseover et mouseout) je fait affiche ou disparaitre la div .html

par **moileraz** » 13 oct. 2009, 17:54

Bonjour Cobaye,
dans mon cas est ce que je peut faire ca :

Code : Tout sélectionner

<div class="dhtml" onmouseover="slideDown();" ><a href="page.html" >Slide</a>;
<div id="div1" style="display:none;">Ici je met mon text</div></div>

Code : Tout sélectionner

function slideDown(){

$('.dhtml').each(function(){
      $(this).parent().hover(
            function(){
               $(this).children('.dhtml').show();
            },
            function(){
               $(this).children('.dhtml').hide();
            });
   });

}

par **Cobaye** » 13 oct. 2009, 17:25

pour un menu déroulante avec une dhtml qui s'affiche sous le libellé de mon menu voici mon code

Code : Tout sélectionner

$('.dhtml').each(function(){
		$(this).parent().hover(
				function(){
					$(this).children('.dhtml').show();
				},
				function(){
					$(this).children('.dhtml').hide();
				});
	});

J'utlise plutot show et hide et biensur hover

par **moileraz** » 13 oct. 2009, 17:20

Bonjour,
j'utilise pour une page jquery slideDown et slideUp qui s'execute avec une action mouseover/mouseout

Ci-dessous un petit bout du code:

Code : Tout sélectionner

<a href="page.html" onmouseover="slideDown("div1");" onmouseout="slideUp("div1");">Slide</a>;
<div id="div1" style="display:none;">Ici je met mon text</div>

Mon problème c'est lors de l'execution de l'effet, ma souri "quitte" la zone slide car ma div apparaît et du coup ça bug. Faut vraiment que je reste sur la zone sans bouger (et loin de la div).

Avez vous une solutions?

J'ai meme essayé ca:

Code : Tout sélectionner

<div onmouseover="slideDown("div1");" onmouseout="slideUp("div1");"><a href="page.html" >Slide</a>;
<div id="div1" style="display:none;">Ici je met mon text</div></div>

merci d'avance pour votre aide

Petit souci mouseover/mouseout avec Jquery

Répondre

Étendre la vue Revue du sujet : Petit souci mouseover/mouseout avec Jquery

Re: Petit souci mouseover/mouseout avec Jquery

Re: Petit souci mouseover/mouseout avec Jquery

Re: Petit souci mouseover/mouseout avec Jquery

Re: Petit souci mouseover/mouseout avec Jquery

Re: Petit souci mouseover/mouseout avec Jquery

Re: Petit souci mouseover/mouseout avec Jquery

Re: Petit souci mouseover/mouseout avec Jquery

Petit souci mouseover/mouseout avec Jquery