Die Swiper-Aktualisierungsfunktion von iDangero.us funktioniert nach dem Ein-/Ausblenden von Folien nichtJquery

JQuery-Programmierung
Anonymous
 Die Swiper-Aktualisierungsfunktion von iDangero.us funktioniert nach dem Ein-/Ausblenden von Folien nicht

Post by Anonymous »

Ich brauche Hilfe bei Swiper.
Laut der Dokumentation hier: http://idangero.us/swiper/api/ muss ich mySwiper.update() aufrufen, nachdem ich Folien manuell ausgeblendet/angezeigt habe. Aber in meinem Fall funktioniert es nicht immer.

Ich habe nach diesem Problem gesucht, bin aber nur auf die folgenden Lösungen gestoßen, die aus irgendeinem Grund nicht funktionieren sollten:
  • mySwiper.update() wie ich bereits erwähnt habe
  • observer: true, watchParents: true beim Initialisieren von Swiper.
Vielleicht stimmt etwas mit meinem jQuery-Code nicht, aber ich kann es nicht herausfinden.

So initialisiere ich Swiper, da ich 2 Zeilen und 3 Spalten benötige, um Daten anzuzeigen.

Code: Select all

var swiper = new Swiper('.swiper-container', {
slidesPerView: 3,
slidesPerColumn: 2,
spaceBetween: 30,
observer: true,
observeParents: true,
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
pagination: {
el: '.swiper-pagination',
clickable: true,
},
});
Der Swiper-Wrapper sieht in HTML so aus:

Code: Select all




[img]./images/plu2.jpg[/img]

Default Lorem ipsum dolor sit amet.







[img]./images/plu2.jpg[/img]

Default Lorem ipsum dolor sit amet.







[img]./images/plu2.jpg[/img]

Default Lorem ipsum dolor sit amet.





Und so möchte ich den Wrapper aktualisieren:

Code: Select all

// 'category1' button/tab selector
$('#category1').on('click', function() {
$('.swiper-slide').hide();
$('.Category1').show();
swiper.update(true);
});
// category2 button/tab selector
$('#category2').on('click', function() {
$('.swiper-slide').hide();
$('.Category1').show();
swiper.update();
});
// 'All' button/tab selector - to show all slides, this i use only to show animation that all slides were loaded, this is working fine every time with swiper update
$('#all').on('click', function() {
$('.swiper-slide').hide();
$('.swiper-slide').show();
swiper.update();
});
Irgendwelche Ideen? Oder wie soll ich die Folien anders ein-/ausblenden? Bitte lassen Sie es mich wissen.

Und falls das Problem nicht klar ist, rufe ich swiper.update() auf, damit die Folienpositionen aktualisiert werden, denn wenn die Folien gefiltert (ausgeblendet/angezeigt) werden, werden die verbleibenden Folien an ihrer Position angezeigt.

Quick Reply

Change Text Case: 
   
  • Similar Topics
    Replies
    Views
    Last post