div cacher et montrer javascript ayant problème clignotant dans mozilla

Mon javascript estdiv cacher et montrer javascript ayant problème clignotant dans mozilla

function Show1() 
    { 
     //document.getElementById("Popup_tooltip").style.overflow="auto"; 
     document.getElementById("Popup_tooltip").style.display="block"; 
    } 
    function Hide1() 
    { 
     /* hide the pop-up */ 
     document.getElementById("Popup_tooltip").style.display="none"; 

    }

mon css pour div est

.tooltip 
{ 
    display:block; 
    position:absolute; 
    top:145px; 
    left:700; 
    width:100%; 
    height:100%; 

}

et ma div est

<div id="Popup_tooltip" class="tooltip" >    
     <table width="180" height="70" border="1" bordercolor="#3a93ed" style="border-collapse:collapse;" cellspacing="0" cellpadding="0"> 
      <tr> 
       <td bgcolor="#ebf5ff"> 
        Help contents related to this topic will display here. 
        As a tooltip, if u need for help? 
       </td> 
      </tr> 
     </table>     
</div>

et onmouseover et mousehide j'appelle fonction afficher et masquer .. Son venant correctement dans IE mais ayant des problèmes dans Mozilla Veuillez répondre dès que possible thanx

Source

2009-02-10 Anonymous

Si je déplace le curseur sur l'image, alors mon div clignote dans Mozilla mais dans IE c'est –

-2

Avez-vous déjà pensé à utiliser une bibliothèque JavaScript qui a déjà été créée et testée pour le navigateur croisé?

comme jQuery (vous donner celui-ci parce qu'il est celle adoptée par Microsoft)

utilisant cette bibliothèque, vous pouvez écrire:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title></title> 

    <script src="_assets/js/jquery-1.3.1.js" type="text/javascript"></script> 

    <script type="text/javascript"> 
     $(document).ready(function() { 
      $("#Popup_tooltip").hide(); 

      $("#showTooltip").hover(function() { 
       $("#Popup_tooltip").show("slow").stop; 
      }, function() { 
       $("#Popup_tooltip").hide("slow").stop; 
      }); 
     });   
    </script> 

    <style type="text/css"> 
     .tooltip 
     { 
      width: 180px; 
      height: 70px; 
      border: solid 1px #ea93ed; 
      background-color: #ebf5ff; 
      padding: 5px; 
     } 
    </style> 
</head> 
<body> 
    <a id="showTooltip" href="#">click here to show the tooltip</a> 
    <div id="Popup_tooltip" class="tooltip"> 
     Help contents related to this topic will display here. As a tooltip, if u need for 
     help? 
    </div> 
</body> 
</html>

ou tout simplement utiliser un plugin jQuery Tooltip par exemple

Source

2009-02-10 12:48:02 balexandre

je n'ai pas downvote cela, et l'appel à jQuery est un genou, mais dans ce cas, il pourrait juste sortir l'OP de problème auto-écrit. – annakata

Qu'est-ce que élément exact reliez-vous les événements de souris à?

Il existe deux causes communes à cet effet. On est en train de trébucher sur votre propre état parce que le survol de la souris cache effectivement l'objet qui déclenche un mouvement de souris lorsque le curseur se déplace à nouveau, ad infinitum. L'autre est que les deux événements sont sur des objets différents et trébucher sur un cache lui-même et déclenche un événement sur le suivant.

Source

2009-02-10 12:51:59 annakata

son entrée correctement dans IE mais ayant problème dans Mozilla

fonctionne bien pour moi. Vous devrez nous dire quel est le problème exact que vous rencontrez.

gauche: 700;

Doit être 700px.

onmouseover et mousehide i appeler la fonction

On peut supposer que vous voulez dire onmouseout.

Source

2009-02-10 12:52:36 bobince

L'événement MouseOut se déclenche lorsque vous vous déplacez dans la zone de l'un des éléments enfants de l'élément sur lequel le gestionnaire d'événements est établi.

J'ai pris le code de la magnifique jQuery in Action-demonstrate here

Le premier div (externe 1) a des gestionnaires d'événements pour les événements et Mouseover mouseout. Chaque fois qu'un événement est déclenché, eventhandler écrit le nom de l'événement sous les divs. Lorsque vous traversez la frontière entre Outer 1 et Inner 1, les gestionnaires d'événements mouseout et mouseover se déclenchent, ce qui dans votre cas provoque le scintillement.

La deuxième div (Outer 2) possède des gestionnaires d'événements pour les événements mouseover et mouseout mais ceux-ci ont été créés via la commande jQuery .hover(). Lorsque les frontières entre Outer 2 et Inner 2 sont franchies, les gestionnaires d'événements ne tirent pas, mais le font lorsque la souris traverse la limite Outer 2.

Je crois que c'est votre problème.

Note: Ceci est pas une réponse à dire « utiliser jQuery » - Je ne l'ai utilisé le code jQuery pour mettre en évidence le problème.

Source

2009-02-10 13:18:05

Mon collègue a été confronté au même problème. Voici notre problème, s'il vous plaît vérifier s'il correspond avec vous:

Dans notre cas, l'info-bulle était un élément div qui était caché et devient visible lorsque la souris a été déplacée sur un lien. De plus, lorsque la souris quitte le lien, l'élément div est masqué.

Le problème avec notre code était que, l'info-bulle, quand elle était visible, est venue sur le lien. Ainsi, le curseur de la souris reposait effectivement sur l'info-bulle. Autrement dit, la souris n'était pas au-dessus du lien mais au-dessus de l'info-bulle. Dans ce cas, Mozilla Firefox déclenche un événement 'onMouseOut' qui entraîne la disparition de l'info-bulle.

Maintenant que le curseur de la souris est sur le lien, l'événement 'onMouseOver' est déclenché et l'info-bulle est visible. Cela continue et encore ...

La solution consistera à utiliser une propriété d'index z plus élevée pour l'info-bulle que la liaison. Essayez de vous assurer que les valeurs de z-index données sont des nombres positifs car Firefox ne reconnaît pas les nombres négatifs.

Source

2009-02-10 14:18:56

Je suis tombé sur ce qui semble être un problème similaire. L'utilisateur déplace le pointeur au-dessus d'une image et un div flotte au-dessus de la page à la position du pointeur tout en affichant une autre image. Il ne semblait pas y avoir de problème avec IE, mais le div entier clignotait avec Firefox. Ce que Shree a dit à propos du pointeur étant au-dessus de l'info-bulle m'a aidé à résoudre ce problème. Ce que j'ai fait, au lieu de placer les x et y de la div à l'emplacement exact du pointeur, je l'ai placé de 2 ou 3 pixels. De cette façon, la souris peut être empêchée de passer au-dessus de la div et ainsi de déclencher l'événement mouseout. Ce n'est pas une manière très élégante de le réparer, mais cela fonctionne si vous pouvez vivre avec votre infobulle de 2-3 pixels trop haut.

Source

2009-11-13 09:02:39 Yves

div cacher et montrer javascript ayant problème clignotant dans mozilla

Répondre

Questions connexes