IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Masquer un div lorsque la souris n'est plus dessus


Sujet :

JavaScript

  1. #1
    Membre du Club Avatar de Agoye
    Inscrit en
    Décembre 2004
    Messages
    61
    Détails du profil
    Informations forums :
    Inscription : Décembre 2004
    Messages : 61
    Points : 68
    Points
    68
    Par défaut Masquer un div lorsque la souris n'est plus dessus
    Bonjour,
    je souhaiterais afficher une zone de texte comportant des liens au passage de la souris sur une image
    => pour cette partie pas de pb, au survol de mon image j'affiche ma division avec un :
    document.getElementById(baliseId).style.visibility='visible'; document.getElementById(baliseId).style.display='block';


    Maintenant je souhaite que cette division (ma division est en position absolute) se masque lorsque la souris n'est plus dedans,

    et là je n'y comprends rien le onmousedown fonctionne mais ne me convient pas car je ne veux pas forcement cliquer pour masquer la zone et en plus mes liens ne s'execute plus et le onmouseout ne fonctionne pas car quand je navigue dans la zone du div, il se cache immédiatement (donc pas le temps de cliquer sur le lien...)

    en fais je souhgaiterais un rendu comme sur le site d'amazon : http://www.amazon.com/exec/obidos/su...589228-1191202

    lorsqu'on passe sur l'onglet "See All 32 Product Categories"

    Merci d'avance

  2. #2
    Rédacteur
    Avatar de MasterOfChakhaL
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2004
    Messages
    2 147
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 44
    Localisation : France

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Juin 2004
    Messages : 2 147
    Points : 3 264
    Points
    3 264
    Par défaut
    une idée comme ca:

    tu peux peut-être essayer de définir l'attribut onmouseout de ton div avec une fonction qui se lance à l'événement onmouseover de ce même div...

    l'événement onmouseout doit faire disparaitre la div puis mais aussi réinitialiser ce même événement...

    attention, si tu fais disparaitre ton div en utilisant la propriété display:none, il ne sera peut être plus accessible, donc cahe le plutot avec la propriété visibility:hidden

    J'espère que j'ai été suffisament clair...
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    N'oubliez pas de cliquer sur quand votre question à trouvé une solution.

    Si vous n'avez pas encore lu les règles du club, mieux vaut tard que jamais!

  3. #3
    Membre du Club Avatar de Agoye
    Inscrit en
    Décembre 2004
    Messages
    61
    Détails du profil
    Informations forums :
    Inscription : Décembre 2004
    Messages : 61
    Points : 68
    Points
    68
    Par défaut
    Je suis désolé mais je ne comprends pas ton explication (faut dire que le javascript ne m'aime pas aussi!).

    Je ne sais pas si je me suis bien expliquée mais ce que je veux faire est qu'à partir d'une image j'ai un menu déroulant avec du texte et des image (dans un div) qui s'affiche et comme j'ai plusieurs images et donc plusieurs menu je veux que se div se masque automatiquement...

    parce que mon pb est que sur le on mouseout de mon div (qui contient) mon menu j'ai collé la fonction suivante :

    function cacheId(baliseId) {
    if (document.getElementById && document.getElementById(baliseId) != null) { document.getElementById(baliseId).style.visibility='hidden'; } }

    et le résultat est que quand je me ballade à l'intérieur de mon div la zone se masque (donc je ne peux pas cliquer) donc je ne comprend pas trop ton explication pour ce qui est de la réinitialisation de l'évènement et je ne comprend surtout pas pourquoi le onmouseout se déclenche lorsque je suis dans mon div?

  4. #4
    Membre du Club Avatar de Agoye
    Inscrit en
    Décembre 2004
    Messages
    61
    Détails du profil
    Informations forums :
    Inscription : Décembre 2004
    Messages : 61
    Points : 68
    Points
    68
    Par défaut
    Bon je viens de me rendre compte que mon problème venait du fait que dans le div que je souhaite afficher ou masquer j'y ajoutais un tableau. Sans le tableau ma zone se masque correctement mais dès que j'y ajoute une table ça ne marche plus, y a t-il une solution pour contourner le pb?
    merci d'avance

  5. #5
    Rédacteur
    Avatar de MasterOfChakhaL
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2004
    Messages
    2 147
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 44
    Localisation : France

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Juin 2004
    Messages : 2 147
    Points : 3 264
    Points
    3 264
    Par défaut
    salut,

    pour répondre à ta question, un bout de code serait vraiment utile...
    (ton image ton div ton table par exemple)
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    N'oubliez pas de cliquer sur quand votre question à trouvé une solution.

    Si vous n'avez pas encore lu les règles du club, mieux vaut tard que jamais!

  6. #6
    Membre du Club Avatar de Agoye
    Inscrit en
    Décembre 2004
    Messages
    61
    Détails du profil
    Informations forums :
    Inscription : Décembre 2004
    Messages : 61
    Points : 68
    Points
    68
    Par défaut
    Oui en effet avec un exemple ce sera plus simple, alors voilà ma page en pj de test

    pour donner une petite explication les carrés bleu correspondent à des tests et l'image google et le div qui s'affiche correspondent à ce que je veux en réalité!

    En fait je souhaiterai arrivé à me balader dans le carré bleu ou il y a des liens sans que la popup ne s'ouvre mais je n'y arrive pas...
    Fichiers attachés Fichiers attachés

  7. #7
    Membre confirmé
    Avatar de FMaz
    Inscrit en
    Mars 2005
    Messages
    643
    Détails du profil
    Informations forums :
    Inscription : Mars 2005
    Messages : 643
    Points : 640
    Points
    640
    Par défaut
    Moi je vois 2 solutions pour fermer ton div correctement,

    A) tu détecte si le curseur passe dans une zone AUTRE que celle qui lance ton div et ton div lui-meme.

    B) Un timer attend 5 secondes avant de fermer le div mais si le curseur est passé sur le div, le compte de 5 secondes reprend.


    La solution B est facile mais laide
    La solution A est complexe mais chouette.

Discussions similaires

  1. Réponses: 1
    Dernier message: 13/12/2013, 04h56
  2. Réponses: 2
    Dernier message: 30/11/2008, 17h26
  3. [VBA-E] masquer une combo lorsqu'elle est vide
    Par lio62 dans le forum Macros et VBA Excel
    Réponses: 46
    Dernier message: 04/02/2007, 21h16
  4. Afficher/Masquer un <DIV> au clique de la souris.
    Par Joad dans le forum Général JavaScript
    Réponses: 5
    Dernier message: 24/09/2005, 10h55
  5. imposer une hauteur de div meme si le texte est plus long
    Par bébé dans le forum Balisage (X)HTML et validation W3C
    Réponses: 3
    Dernier message: 24/08/2005, 11h29

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo