.cycle de $ et le contenu dynamique après un événement de clic

Question

Je veux appliquer le cycle au bloc div avec du contenu dynamique. Ce contenu sera généré après un événement de clic. Une fois que je clique sur l'image qu'il fonctionne après qu'il ne fonctionne pas.

Code:

$("div.cls img").click(function() {

  ....  Adding the content


 $('#myDiv').cycle({
            fx: 'scrollHorz',
            speed: 3500,
            timeout: 0, continuous: true,
            pause: 1, sync: 1
        }); 
}); 

HTML:

<div id="myDiv">
 <div>
 <a id="i1"> abc</a>
 <a id="i2"> abcd</a>
 <a id="i3"> abce</a>
   <a id="i4"> abcf</a>
 <a id="i5"> abcg</a>
 <a id="i6"> abch</a>
</div>
 <div>
 <a id="i11"> abc1</a>
 <a id="i21"> abcd1</a>
 <a id="i31"> abce1</a>
   <a id="i41"> abc1f</a>
 <a id="i51"> abcg1</a>
 <a id="i61"> abch1</a>
</div>
</div>

Answer 1

EDIT:

Essayez d'appeler à nouveau $.cycle() après avoir ajouté votre contenu dynamique. En outre, utiliser Firebug pour vous assurer que votre contenu est généré correctement.

Si cela ne fonctionne pas, alors il semble que vous devrez modifier le plug-in de cycle pour soutenir dynamiquement ajouter « diapositives », ou écrivez votre propre solution.

---

De http://www.malsup.com/jquery/cycle/ :

  

Comment ça marche?

     

Le plugin fournit une méthode appelée   cycle qui est invoquée sur un récipient   élément. Chaque élément enfant du   récipient devient un « slide ». Les options   contrôler quand et comment les diapositives sont   la transition.

Alors, vous pouvez laisser votre Javascript seul, mais le HTML devrait ressembler à ceci:

<div id="myDiv">
  <div>
    <a id="i1"> abc</a>
    <a id="i2"> abcd</a>
    <a id="i3"> abce</a>
    <a id="i4"> abcf</a>
    <a id="i5"> abcg</a>
    <a id="i6"> abch</a>
  </div>
  <div>
    <a id="i11"> abc1</a>
    <a id="i21"> abcd1</a>
    <a id="i31"> abce1</a>
    <a id="i41"> abc1f</a>
    <a id="i51"> abcg1</a>
    <a id="i61"> abch1</a>
  </div>
</div>

En outre, vous ne devriez jamais avoir plus d'un élément sur une page avec le même ID.