Search code examples
javascriptjqueryjquery-mobilescrolljquery-mobile-collapsible

Scroll position of a jquery mobile 1.0 collapsible set when expanded


My question is pretty much the same as this one except that I'm using jQuery Mobile 1.0. The entire project has been written and I don't want to have to update it to 1.3.2 just to get this scroll feature to work with my collapsible set. Is there anything I can use from the answer provided in the linked question that can be adapted to 1.0?

Thanks


Solution

  • Upgrading isn't required in order to have the scroll working. Only the way of listening to expand event is different.

    Bind

    $(".ui-collapsible").bind("expand", function () {
      /* scroll */
    });
    

    Delegate

    $(document).delegate(".ui-collapsible", "expand", function () {
      /* scroll */
    });
    

    Scroll

    var position = $(this).offset().top;
    
    /* scroll with animation */
    $("html, body").animate({
        scrollTop: position
    });
    
    /* scroll without triggering scroll event */
    $.mobile.silentScroll(position);
    

    Demo