$ .cycle und dynamischer Inhalt nach einem Klickereignis
-
23-09-2019 - |
Frage
Ich möchte den Zyklus auf den Div -Block mit dynamischem Inhalt anwenden. Dieser Inhalt wird nach einem Klickereignis generiert. Sobald ich auf das Bild klicke, funktioniert es danach nicht.
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>
Lösung
BEARBEITEN:
Versuchen Sie es zu rufen $.cycle()
Nochmals nach dem Hinzufügen Ihres dynamischen Inhalts. Verwenden Sie auch Firebug, um sicherzustellen, dass Ihr Inhalt korrekt generiert wird.
Wenn das nicht funktioniert, müssen Sie das Zyklus -Plugin ändern, um dynamisch "Folien" hinzuzufügen oder Ihre eigene Lösung zu schreiben.
Aus http://www.malsup.com/jquery/cycle/:
Wie es funktioniert
Das Plugin bietet eine Methode namens Cycle, die auf einem Containerelement aufgerufen wird. Jedes untergeordnete Element des Behälters wird zu einer "Folie". Optionen steuern, wie und wann die Folien übergeführt werden.
Sie können also Ihr JavaScript in Ruhe lassen, aber die HTML sollte so aussehen:
<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>
Außerdem sollten Sie nie mehr als ein Element auf einer Seite mit derselben ID haben.