jQuery Mobile Page Scrolls to Top in Android 2.2 Browser When a Select Menu is Opened (Solved)

By default jQuery Mobile loads native OS select menu and in Android 2.2 browser this somehow invokes the jQuery Mobile's functionality of scrolling to top, to prepare for loading a new page, even though there is no hyperlinking.

A solution is to not use native lists. I opened gmail's sign up menu in Android Emulator with 2.2 version, and they are also not using native menus, so it seems like an okay idea. Though, the documentation states that custom menus are slightly resource-intensive.

Enable Custom Select Menus
To use custom menus on a specific select, just add the data-native-menu="false" attribute. Alternately, this can also programmatically set the select menu's nativeMenu configuration option to false in a callback bound to the mobileinit event to achieve the same effect. This will globally make all selects use the custom menu by default. The following must be included in the page after jQuery is loaded but before jQuery Mobile is loaded.

    $(document).bind('mobileinit',function(){
        $.mobile.selectmenu.prototype.options.nativeMenu = false;
    });

See also jQuery Mobile select menu documentation.

Comments