Is this a fix for iPhone/iPad scroll problems?

[beebs93]

The iPhone and iPad don't seem to trigger the auto-scroll event unless you zoom in a bit. A temporary solution seems to add the correct zoom level via a meta tag in the header like so:

< meta name="viewport" content="width=device-width, initial-scale=1" >

On the iPad, when you switch from portrait to landscape layout and then zoom out all the way, sometimes the event doesn't fire (regardless of this meta tag or not) - I haven't figured that one out yet, though.

[lukeshumard]

Personally, I think that the best way to handle iPhone / mobile is to unbind the plugin from scroll events. There are too many variables in devices to ensure that the plugin will work correctly, which is why I prefer the "twitter-style" approach, or manual trigger.

That said, if this works, awesome! I'll play around with it in the near future.

[beebs93]

I still can't get the iPad to play nice - it's finicky as hell and I've just given up (for now).

The iPhone/iPod seems to still trigger the event with just width="device-width" so it's going in the right direction.

If you take out the meta tag entirely the event stops firing -- unless you zoom in manually.

Once the project goes live I'll post a link if that'll help.

Cheers,

-Brad

[lukeshumard]

Which version of the plugin are you using? As I said in my previous post, I would highly advise to unbind from the scroll event and instead do a manual trigger. If you're using a 2.0b version, you can use the code below

$(document).ready(function(){

    // set up infinite scroll
    $('#container').infinitescroll({
        // insert your options here
    });

    // unbind infinite scroll from automatically
    // fetching the next page
    $('#container').infinitescroll('binding','unbind');

    // when the a tag (id 'load-more') is clicked,
    // fetch the next page
    $('#load-more').click(function(e){

        e.preventDefault();
        $('#container').infinitescroll('retrieve');

        // the plugin currently sets 'display:none' on your nav selector
        // this is probably going to change, but for the moment, just do this.
        $(this).css('display','block');

    });

});

[beebs93]

Version: 1.5.100504

I'll keep the above in mind if we decide to switch to a manual trigger - thanks for the info! :)