1

I have issue with collapsible jQuery mobile. I'm using Multipage template, where all the pages are in the same document, separated with the div named page. I have two Collapsible, one on each page. I made an animation to the top of the page, my code is above:

$(document).on("pagecreate",function(event, ui){
// alert("pagecreate event fired - the page has been initialized, the DOM has been loaded and jQuery Mobile has finished enhancing the page.");
$("[data-role='collapsible']").collapsible({

    collapse: function( event, ui ) {
        $(this).children().next().slideUp(300);
    },
    expand: function( event, ui ) {
        $(this).children().next().hide();
        $(this).children().next().slideDown(300);
        $("body, html").animate({
            scrollTop: $(".ui-collapsible-heading-toggle").offset().top
        }, 'slow');  
    }
});     

$('.ui-collapsible-heading-toggle').click(function(){
    $("body, html").animate({
        scrollTop: $(".ui-collapsible-heading-toggle").offset().top
    }, 'slow');
});

In the first collapsible animation works, but in the second, only the animations slideUp and slideDown work, with offset nothing happens.

Why??

Thanks for help!

Uri Agassi
  • 36,848
  • 14
  • 76
  • 93
Tamiris
  • 21
  • 4
  • `$('.ui-collapsible-heading-toggle').click(function(){ $("body, html").animate({ scrollTop: $(".ui-collapsible-heading-toggle").offset().top }, 'slow'); });` place it inside `pagecreate`. Also, you need to specify `#pageID` otherwise you'll get multiplied listeners. – Omar Apr 23 '14 at 15:35
  • like in this demo http://jsfiddle.net/Palestinian/2hPQn/ – Omar Apr 23 '14 at 15:48

0 Answers0