CODEWITHSUNDEEP
jqueryinternet-explorermobilescrollview
Bart Burg
Bart Burg

Reputation: 4924

Get jQuery mobile scrollview to work on desktop as well?

I currently have a web application working both on desktop browsers and tablets. I got everything to work and listening to the correct event types, except the jquery mobile scrollview.

I use this plugin for a navigation bar on the bottom. It works on all browsers but internet explorer. Does anyone know what to change in the file to let it work on ie?

I've also found the plugin iScroll, but this one doesn't give the same functionallity. I'd rather stay with jquery mobile scrollview if possible.

Upvotes: 0

Views: 824

Answers (3)

Brian Kalbfleisch
Brian Kalbfleisch

Reputation: 21

Instead of editing the jquery.mobile.scrollview.js, you could set the opts when creating the object by first checking if the browser is IE:

if($.browser.msie){
   opts.scrollMethod = "scroll";
}

Use this in the page create function

var $page = $( this );

// For the demos that use this script, we want the content area of each
// page to be scrollable in the 'y' direction.

//$page.find( ".ui-content" ).attr( "data-" + $.mobile.ns + "scroll", "y" );

// This code that looks for [data-scroll] will eventually be folded
// into the jqm page processing code when scrollview support is "official"
// instead of "experimental".

$page.find( ":jqmData(scroll):not(.ui-scrollview-clip)" ).each(function () {
    var $this = $( this );
    // XXX: Remove this check for ui-scrolllistview once we've
    //      integrated list divider support into the main scrollview class.
    if ( $this.hasClass( "ui-scrolllistview" ) ) {
        $this.scrolllistview();
        scrollViewObj = $this;
    } else {
        var st = $this.jqmData( "scroll" ) + "",
            paging = st && st.search(/^[xy]p$/) != -1,
            dir = st && st.search(/^[xy]/) != -1 ? st.charAt(0) : null,

            opts = {
                direction: dir || undefined,
                paging: paging || undefined,
                scrollMethod: $this.jqmData("scroll-method") || undefined
            };


        if($.browser.msie){
            opts.scrollMethod = "scroll";
        }
        $this.scrollview( opts );
        scrollViewObj = $this;
    }

});

Upvotes: 1

Bart Burg
Bart Burg

Reputation: 4924

In order to let jquery mobile scrollview work with IE, modify the jquery.mobile.scrollview.js, line 22 to: > scrollMethod: "scroll", // "translate", "position", "scroll" This is by default set on translate, which is not supported by IE.

Upvotes: 1

Skyste
Skyste

Reputation: 66

Chances are it won't work on IE natively. jQuery mobile is very HTML5 based, IE isn't very HTML5 compliant.

The best thing to do would be to look into chrome frame and let Google take care of the lack of HTML5 support in IE. It's pretty simple to implement, there's templates on the site and it should speed up the rest of the JavaScript on the site too.

Hope that helps!

Upvotes: 0

Related Questions