Ich versuche eine unterschiedliche Dauer für jede Folie zu haben, da meine Folien einige große Inhalte und einige kleine haben, bitte geben Sie mir eine Lösung mit Geige
Ich habe es versucht, aber es funktioniert nur beim Timing der Folienanimation:
%Vor%Bootstrap 3.1 Karussell erlaubt keine unterschiedliche Dauer für jede Folie, aber es bietet eine Methode und ein Ereignis die wir verwenden können, um dies zu erreichen. p>
Wir werden das Ereignis slid.bs.carousel verwenden, um zu erkennen, wann das Karussell seinen Folienübergang abgeschlossen hat und die Option .carousel('pause') , um das Karussell daran zu hindern, durch die Elemente zu fahren.
Wir werden dieses Attribut data-interval="x" für jedes Karussellelement mit unterschiedlicher Zeitdauer verwenden, sodass unser HTML beispielsweise wie folgt aussieht:
Jetzt müssen wir nur noch:
slid.bs.carousel angezeigt wird
Ereignis .carousel('pause')
Der JavaScript-Code sieht folgendermaßen aus:
%Vor% Wie Sie sehen, sind wir am Anfang gezwungen, ein Startintervall hinzuzufügen, und ich habe es auf 1000ms eingestellt, aber ich entferne es jedes Mal, wenn ich das Karussell duration-1000 pausiere. Ich habe die folgenden Zeilen verwendet, um das Problem mit dem ersten Element zu lösen, da dieses Objekt nicht von slid event abgefangen wurde.
Ich habe auch bemerkt, dass, wenn der Benutzer die Pfeile drückt, die Zeitüberschreitung verrückt wird, deshalb lösche ich die Zeitüberschreitung jedes Mal, wenn der Benutzer auf den linken und rechten Pfeil drückt.
Hier ist mein Live-Beispiel Ссылка , ich hoffe, diese Antwort war hilfreich für Sie.
Aus irgendeinem Grund schien die Pausenmethode für mich zu funktionieren. Also habe ich den folgenden Code benutzt und es hat für mich funktioniert. Dies funktioniert auch, wenn Sie mehrere Karussells auf derselben Seite haben. Dieser Ansatz erfordert jedoch, dass das Datenintervall-Attribut für jedes Karussellelement obligatorisch ist.
%Vor%Tags und Links twitter-bootstrap twitter-bootstrap-3