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 :

[DOM] Création de lien dans des balise en place


Sujet :

JavaScript

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre du Club
    Profil pro
    Inscrit en
    Avril 2007
    Messages
    7
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2007
    Messages : 7
    Par défaut [DOM] Création de lien dans des balise en place
    Bonjour et excusez moi de vous dérangez, mais je n'arrive pas à trouver de script javascript que me permettent de faire ce que je souhaite.

    Je suis, comme on dis, un newbie dans la programmation javascript, j'ai pas mal de mal à le comprendre.

    J'èspère que vous allez pouvoir m'aider.

    Sur cette page, j'ai du contenu qui est masqué par javascript, puis lorsque que l'on clique sur les logo, le contenu s'ouvre.

    Le problème, c'est que si on navigue au clavier, il est impossible d'ouvrir les contenu.

    Donc pour résoudre ce problème, il faudrais que je crée automatiquement des liens en javascript dans les balises <h2>.

    Vous allez me dire pourquoi ne pas les mettre à la main ? Tout simplement car si le javascript est inactif, ca ne sert à rien du tout d'avoir des liens à cet endroit.

    Merci pour votre aide !

  2. #2
    LEK
    LEK est déconnecté
    Membre éclairé
    Profil pro
    Inscrit en
    Mai 2005
    Messages
    715
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2005
    Messages : 715
    Par défaut
    Si c'est vraiment ce que tu veux faire alors tu n'as qu'à générer directement tes liens et tes balises avec javascript :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
     
    document.write("<h2><a href='#'>Here is my logo!</a></h2>");
    Mais côté accessibilité, il y a mieux... L'idée étant d'essayer de conserver l'ergonomie que l'utilisateur ait ou non désactiver javascript!

  3. #3
    Invité
    Invité(e)
    Par défaut
    Pour afficher ton contenu masquer, tu utilise surement un appel de fonction grace à onClick. Pour que ça fonctionne avec la navigation au clavier, il faut doubler cet appel avec onFocus (même évènement que onClick mais lors d'une sélection au clavier, s'emploie de la même façon).

    Bonne chance !

  4. #4
    Membre du Club
    Profil pro
    Inscrit en
    Avril 2007
    Messages
    7
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2007
    Messages : 7
    Par défaut
    Citation Envoyé par sbooob
    Pour afficher ton contenu masquer, tu utilise surement un appel de fonction grace à onClick. Pour que ça fonctionne avec la navigation au clavier, il faut doubler cet appel avec onFocus (même évènement que onClick mais lors d'une sélection au clavier, s'emploie de la même façon).

    Bonne chance !
    J'utilise la librairie Jquery pour obtenir les effet de hide/show avec glissement. J'ai pu le réaliser en lisant ce tutorial sur le net.

    Je suis vraiment naze en js.

  5. #5
    Membre émérite
    Profil pro
    Inscrit en
    Février 2006
    Messages
    624
    Détails du profil
    Informations personnelles :
    Âge : 50
    Localisation : France

    Informations forums :
    Inscription : Février 2006
    Messages : 624
    Par défaut
    En javascript, tu as à disposition les événements suivant:
    - onKeyDown
    - onKeyPress
    - onKeyUp

    On leurs associe, de manière classique, un gestionnaire d'évenement.
    Une chose à savoir, c'est qu'il existe un objet Event qui est automatiquement créé par le navigateur puis transmis en paramètre au gestionnaire d'évenement.

    Cela offre l'opportunité de gérer les touches pressées.
    Attention les propriétés de l'objet Event différent suivant les navigateurs et leurs versions.
    Soit Event e.
    1/ Sous Firefox on a e.charCode qui contient le code Ascii de la touche appuyée.
    2/ Sous IE c'est e.keyCode qui contient l'entier représentant ce code Ascii.

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    <html>
    <script type="text/javascript">
    document.onkeypress = keypressHandler;
    function keypressHandler(e){ 
      e = e || window.event;
      if (event.keyCode == 13){ // touche entrée
        // code spécifique
        return true;
      }	
    }
    </script>
    <body>
    </body>
    </html>

  6. #6
    Membre du Club
    Profil pro
    Inscrit en
    Avril 2007
    Messages
    7
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2007
    Messages : 7
    Par défaut
    Merci pour ces précision Fabrice, (moi c'est Sylvain)

    Je prefererais ne pas avoir à définir de touches à la place de l'utilisateur.

    Si je ne trouve pas un autre moyen j'essairais d'appliquer celui là.

    Merci pour ton aide en tout cas

  7. #7
    Membre du Club
    Profil pro
    Inscrit en
    Avril 2007
    Messages
    7
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2007
    Messages : 7
    Par défaut
    Citation Envoyé par LEK
    Si c'est vraiment ce que tu veux faire alors tu n'as qu'à générer directement tes liens et tes balises avec javascript :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
     
    document.write("<h2><a href='#'>Here is my logo!</a></h2>");
    Mais côté accessibilité, il y a mieux... L'idée étant d'essayer de conserver l'ergonomie que l'utilisateur ait ou non désactiver javascript!
    Ca aurais tellement simple de faire ça comme ça. Mais si javascript désactivé, plus de titre.

    Sinon je pourrais très bien faire :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    <h2>
     
    <scrip type="text/javascript">
    //<![CDATA[
    document.write("<a href='#'>");
    //]]>
    </script>
     
    <img src="source.jpg" alt="logo source" />
     
    <scrip type="text/javascript">
    //<![CDATA[
    document.write("</a>");
    //]]>
    </script>
     
    </h2>
    Mais ca serais très lourd, il n'y a t'il pas moyen de dire pour chaque texte compris entre la balise H2, contenu dans la div#contenu , créer un lien href="#" ?

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

Discussions similaires

  1. interprétation des liens dans les balises <a>
    Par hemma731 dans le forum Développement Web avec .NET
    Réponses: 1
    Dernier message: 06/05/2010, 15h46
  2. [DOM] Injection de données dans des balises exotiques
    Par javapalatete dans le forum Général JavaScript
    Réponses: 7
    Dernier message: 06/10/2008, 10h52
  3. [HTML] pb de mise en place d'une balise <div> dans des balises <ul>
    Par youp_db dans le forum Balisage (X)HTML et validation W3C
    Réponses: 3
    Dernier message: 06/11/2006, 16h57
  4. [DOM] récupérer le code dans une balise
    Par mavvv dans le forum Général JavaScript
    Réponses: 1
    Dernier message: 31/03/2006, 08h27

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