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 :

4 liens d'un menu qui ne fonctionnent pas.


Sujet :

JavaScript

  1. #1
    Membre confirmé
    Inscrit en
    Janvier 2009
    Messages
    598
    Détails du profil
    Informations forums :
    Inscription : Janvier 2009
    Messages : 598
    Points : 628
    Points
    628
    Par défaut 4 liens d'un menu qui ne fonctionnent pas.
    Si quelqu'un comprend quelque chose là ?
    Je suis perdu.

    En fait il s'agit d'un menu horizontal qui possède 4 liens.
    Chaque lien <a href.... est dans un div nommé "lien" et les 4 div liens sont dans un div de centrage pour pouvoir centrer horizontalement le menu.
    D'autre part ce div de centrage est contenu dans un div de positionnement ce qui permet de placer le menu horizontal où je veux sur la page si besoin.

    Le problème est que le lien ne fonctionne que si j’enlève l'attribut absolute (la main apparaît sur le lien quand on le survole avec la souris) ce qui n'est pas le cas quand je remet l'attribut absolute.

    Voilà le css du DIV positionneur avec l'attribut absolute :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
     
    .positionneur
    {
    position: absolute;
    left:0;
    top:15%;
    width:100%;
    height:5%;
    background-color:#CC9966;
    }
    Pour permettre de centrer le menu horizontalement avec l'attribut "margin:auto" j'ai dû mettre le menu dans un DIV nommé centreur.
    Voilà le css du DIV centreur

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
     
    .centreur
    {
    position: relative;
    margin:auto;
    top:0;
    width:750px;
    height:100%;
    text-align:center;
    }
    Chaque lien "a href" est contenu dans une balise <span> nommée "liens".
    Ce qui permet d'avoir une classe commune aux 4 liens du menu.
    Voilà le CSS du span liens :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
     
    .liens
    {
    width:150px;
    height:100%;
    float:left;
    top:0;
    margin-right:15px;
    text-align:center;
    font-size:16px;
    font-style:"times new roman";
    }
    Le code HTML du menu :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
     
    <div class="positionneur">
     
    <div class="centreur"> 
     
     <span class="liens"><a href="#" onclick="fonction1()">lien1</a></span> 
     <span class="liens"><a href="#" onclick="fonction2()">lien2</a></span> 
     <span class="liens"><a href="#" onclick="fonction3()">lien3</a></span> 
     <span class="liens"><a href="index.html">lien4</a></span> 
     
    </div> 
     
    </div>
    Je signale que le menu complet c'est à dire le div de positionnement est situé dans un DIV "contener" qui cadre toute la page (le body).
    Ce div contener est lui aussi en absolute avec width=100% et height=100%.

    Je résume la question en disant que les liens ne fonctionnent pas si je met l'attribut absolute au div de positionnement et donc pourquoi cela ne fonctionne-t'il pas ?

    C'est une bizarrerie pour moi .....ou alors je bûche trop :/

    NB:
    J'ai remplacé les div des liens par des <span> pour alléger le source en div.
    Le problème est toujours là en tous cas, je cherche...
    Cliquez ici et reprenez le pouvoir !
    A bas IE !, Google, et le pistage du net, testons DuckDuckGo.com
    Lords Of The Realm II Download : Lords of the realm 2
    Infos en anglais :Ici

  2. #2
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    17 050
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 17 050
    Points : 44 568
    Points
    44 568
    Par défaut
    Bonsoir,
    Je signale que le menu complet c'est à dire le div de positionnement est situé dans un DIV "contener" qui cadre toute la page (le body).
    Ce div contener est lui aussi en absolute avec width=100% et height=100%.
    tu as visiblement un problème de "position de ouche", donc de conception du document.

    Nota : ce type de menu est réalisable sur base de liste UL LI en display inline.

    A voir choix de menus horizontaux

  3. #3
    Membre confirmé
    Inscrit en
    Janvier 2009
    Messages
    598
    Détails du profil
    Informations forums :
    Inscription : Janvier 2009
    Messages : 598
    Points : 628
    Points
    628
    Par défaut
    Je te remercie, je vais voir ton lien

    EDIT :
    le problème reste le même, ce n'est pas la création du menu qui me pose problème, je sais faire, c'est seulement le fait que si je place le menu à l'intérieur du DIV positionneur les liens ne fonctionnent plus, mais si je supprime l'attribut absolute du div positionneur les liens refonctionnent, par contre le menu quitte la place où je l'avais positionné pour se retouver en left=0 et top=0 en haut de la page.
    Au lieu d'être juste sous ma bannière (elle-aussi en absolu).

    EDIT 2 :

    C'est bon ça fonctionne à nouveau, j'ai juste déplacé le code HTML du menu dans un autre emplacement de ma page (plus bas) et ç'est bon.
    je n'y ai réfléchi que maintenant en me disant que je pouvais tester puisque ce menu est en absolute, la place du code peut être changée ça placera quand même le menu où je veux, vive le CSS.

    Merci
    Cliquez ici et reprenez le pouvoir !
    A bas IE !, Google, et le pistage du net, testons DuckDuckGo.com
    Lords Of The Realm II Download : Lords of the realm 2
    Infos en anglais :Ici

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. [CSS 2.1] Menu qui ne fonctionne pas correctement avec IE
    Par beegees dans le forum Mise en page CSS
    Réponses: 0
    Dernier message: 13/10/2010, 10h37
  2. [CSS 2] Sous menu qui ne fonctionne pas sous IE7
    Par dolphi dans le forum Mise en page CSS
    Réponses: 2
    Dernier message: 07/03/2009, 23h06
  3. Lien html dans flash qui ne fonctionne pas?
    Par zuzuu dans le forum Flash
    Réponses: 5
    Dernier message: 08/12/2008, 17h01
  4. [DW MX] lien courriel dans firefox qui ne fonctionne pas
    Par xataka dans le forum Dreamweaver
    Réponses: 1
    Dernier message: 02/11/2007, 14h54
  5. Menu qui ne fonctionne pas
    Par skisofrene dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 26/11/2006, 15h33

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