jquery mobile zusammenklappbare Animation funktioniert nicht

Question

Ich kämpfe derzeit mit einem zusammenklappbaren Set in Jquery Mobile. Ich möchte, dass es beim Öffnen/Schließen animiert wird und beim Öffnen nach oben auf den Bildschirm gleitet. Es arbeitete früher im Projekt, aber irgendwie hörte auf, die Linie hinunter zu arbeiten.

Ich habe alles versucht, um das Problem ohne Glück zu finden; Das Problem besteht immer noch ohne meine CSS-Blätter und ist immer noch ohne die hinzugefügte JS-Codierung. Ich habe auch verschiedene Versionen von jQuery und Jquery Mobile (und in verschiedenen Kombinationen) ausprobiert - immer noch nichts.

machte ich einen jsfiddle mit allen relevanten Codierung: https://jsfiddle.net/usa8bjh1/

Dies ist der Code ich verwende:

$(document).on('pagebeforeshow', function(){ 
$("[data-role='collapsible']").collapsible({ 
    expand: function(event, ui){ 
     $(this).children().next().slideDown(500); 
     $('html, body').animate({ 
      scrollTop: $(this).offset().top - 0 
     }, 800); 
    }, 
    collapse: function(event, ui){ 
     $(this).children().next().slideUp(500); 
    } 
}); 
}); 

Hat damit keine Erfahrung jemand?

Answer 1

Ich habe aktualisiert Ihre fiddle mit einer Arbeitslösung, die Bindung der zusammenklappbaren Ereignisse auf diese Weise:

$(document).on("collapsibleexpand", "[data-role=collapsible]", function() { 
    $(this).children().next().slideDown(500); 
    $('html, body').animate({ 
     scrollTop: $(this).offset().top - 0 
    }, 800); 
}); 

$(document).on("collapsiblecollapse", "[data-role=collapsible]", function() { 
    $(this).children().next().slideUp(500); 
});