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 :

Injection dynamique de code HTML et effet sur sur les class CSS (slider jQuery)


Sujet :

JavaScript

  1. #1
    Membre du Club
    Profil pro
    Inscrit en
    Avril 2003
    Messages
    97
    Détails du profil
    Informations personnelles :
    Localisation : Suisse

    Informations forums :
    Inscription : Avril 2003
    Messages : 97
    Points : 45
    Points
    45
    Par défaut Injection dynamique de code HTML et effet sur sur les class CSS (slider jQuery)
    Bonjour à tous,

    J'utilise un slider qui utilise JQuery
    http://www.ndoherty.biz/demos/coda-slider/2.0/

    Pour le bon fonctionnement du slider pour passer à la page suivante j'utilise le code
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    <a class="xtrig" href="#1" rel="coda-slider-3">Panel 1</a>
    Donc comme ça ca marche sans problèlemes. J'imagine que lors de l'utilisation de la classe CSS "xtrig" le slider comprends qu'il faut passer à la page suivante.

    Par contre quand j'injecte dynamiquement de l'HTML via javascript comme ça

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    container.innerHTML = '<a class="xtrig" href="#4" rel="coda-slider-1"><img src="questions/illu1reponse3V.png" width="" height="" class="" /></a>';
    L'effet ne fonctionne plus sur le slider. Pourquoi ?

    J'imagine que dès que le code apparait après le load ca ne fonctionne plus.

    Comment faire pour conserver l'effet ? Sinon je pourrais précharger le lien et le désactiver jusqu'à ce que j'injecte le nouveau code HTML, mais comment faire ?

    Cordialement
    yodark

  2. #2
    Rédacteur

    Avatar de Bovino
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2008
    Messages
    23 647
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 53
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Juin 2008
    Messages : 23 647
    Points : 91 220
    Points
    91 220
    Billets dans le blog
    20
    Par défaut
    C'est effectivement un problème connu de JavaScript : il est assez mauvais pour prévoir ce qui va arriver sur la page dans le futur

    Plus sérieusement, le fonctionnement est le suivant : lorsque le script est lancé, il récupère les éléments dont il a besoin et leur affecte un comportement, en revanche, il ne peut pas affecter un comportement à des éléments qui n'existent pas encore !
    Eventuellement, tu peux essayer d'utiliser la méthode live() de jQuery, sinon, relancer le script à chaque ajout d'éléments.
    Pas de question technique par MP !
    Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi !
    Mes formations video2brain : La formation complète sur JavaScriptJavaScript et le DOM par la pratiquePHP 5 et MySQL : les fondamentaux
    Mon livre sur jQuery
    Module Firefox / Chrome d'intégration de JSFiddle et CodePen sur le forum

  3. #3
    Membre du Club
    Profil pro
    Inscrit en
    Avril 2003
    Messages
    97
    Détails du profil
    Informations personnelles :
    Localisation : Suisse

    Informations forums :
    Inscription : Avril 2003
    Messages : 97
    Points : 45
    Points
    45
    Par défaut
    relancer le script à chaque ajout d'éléments.
    C'est justement la que je coince un peu. Comment relancer le script ? Vu que je ne suis pas un expert JS je vois pas trop comment faire.

    J'ai essayé de reprendre l'initialisation
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    $('#coda-slider-1').codaSlider();
    Mais du coup tout s'éfface quand je fait ça.

    Pour la fonction live comment l'utiliser dans ce cas la ?

Discussions similaires

  1. Code n'est pas fonctionnel sur tous les navigateurs
    Par fidbell84 dans le forum Mise en page CSS
    Réponses: 18
    Dernier message: 30/06/2015, 20h03
  2. Différence d'un code HTML en local et sur serveur
    Par laurentSc dans le forum Balisage (X)HTML et validation W3C
    Réponses: 6
    Dernier message: 04/10/2011, 13h22
  3. Code body et balises compatibles sur tous les navigateurs ?
    Par sun69 dans le forum Mise en page CSS
    Réponses: 4
    Dernier message: 03/03/2011, 07h26
  4. optimiser code sql access par boucle sur tous les chkbox
    Par thiefer dans le forum Requêtes et SQL.
    Réponses: 8
    Dernier message: 25/09/2008, 21h46
  5. Modification dynamique de code html
    Par xtendance dans le forum Général JavaScript
    Réponses: 3
    Dernier message: 10/10/2006, 11h55

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