search

stephband / jquery.event.swipe

jQuery custom events swipeleft, swiperight, swipeup and swipedown
stephband.info/jquery.event.swipe
446 stars 180 forks source link

Sluggish Scrolling Issue on iOS devices with Twitter Bootstrap 2.3.0 #5

Closed gtwilliams03 closed 11 years ago

gtwilliams03 commented 11 years ago

If I include jquery.event.move and jquery.event.swipe in my layout page (jQuery 1.9.1, jQuery UI 1.10.1, Bootstrap 2.3.0) simple scrolling on mobile devices becomes almost unresponsive. Taking out the move and swipe js files makes the pages work fine (albeit without the swipe events...)

gtwilliams03 commented 11 years ago

Looks like it is Bootstrap latest that is the problem with jquery.event.swipe. I replaced the Bootstrap 2.3.0 include with the older 2.2.2 and it works fine.

Scrolling bad on iPhone with jquery.event.swipe: //netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/js/bootstrap.min.js

Scrolling OK on iPhone: //netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/js/bootstrap.min.js

I'm not sure what changed with Bootstrap 2.3.0 that would affect jquery.event.swipe?

stephband commented 11 years ago

Hi. Thanks for the report. I don't use bootstrap so I'm not familiar with what they could have changed. Does the jquery version change with boostrap version? Not that I've had any problems with different jquery versions...

Do you have remote debugging so you can use Web Inspector to look at what is happening in the Timeline tab? On 24 Feb 2013 19:18, "gtwilliams03" notifications@github.com wrote:

Looks like it is Bootstrap latest that is the problem with jquery.event.swipe. I replaced the Bootstrap 2.3.0 include with the older 2.2.2 and it works fine.

Scrolling bad on iPhone with jquery.event.swipe: // netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/js/bootstrap.min.js

Scrolling OK on iPhone: // netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/js/bootstrap.min.js

I'm not sure what changed with Bootstrap 2.3.0 that would affect jquery.event.swipe?

— Reply to this email directly or view it on GitHubhttps://github.com/stephband/jquery.event.swipe/issues/5#issuecomment-14012878.

gtwilliams03 commented 11 years ago

The problem I have in debugging this is that I have to publish the site and then run it on my iPhone to test it out. I'll try and use Safari to simulate the site and see if I can reproduce any errors.

I also don't know what might have changed from Bootstrap 2.2.2 to 2.3.0 to break your plug-in (which I love and it is very easy to use).

gtwilliams03 commented 11 years ago

Oh, and I don't think jQuery version matters since I am running the latest (1.9.1) and your plug-in runs fine on the iPhone as long as I am using Bootstrap 2.2.2 instead of latest (2.3.0).

stephband commented 11 years ago

Yes, but while it is running on your iPhone you should be able to inspect it using Safari. Go to Settings > Safari > Advanced on the iPhone, enable Web Inspector then plug it in via USB and find the device in the Developer menu in Safari. On 24 Feb 2013 22:11, "gtwilliams03" notifications@github.com wrote:

The problem I have in debugging this is that I have to publish the site and then run it on my iPhone to test it out. I'll try and use Safari to simulate the site and see if I can reproduce any errors.

I also don't know what might have changed from Bootstrap 2.2.2 to 2.3.0 to break your plug-in (which I love and it is very easy to use).

— Reply to this email directly or view it on GitHubhttps://github.com/stephband/jquery.event.swipe/issues/5#issuecomment-14016091.

gtwilliams03 commented 11 years ago

Inspecting this in Safari Web Inspector (thanks for that hint!) - every time I swipe to scroll the page with event.jquery.swipe plugged in - I get "RangeError: Maximum call stack size exceeded".

I added jquery-migrate-1.1.1.js to my project - and it looks like this is somehow related to an event.remove call.

gtwilliams03 commented 11 years ago

Here is the line from jquery migrate that seems to be throwing the exception (the jQuery.event.remove call is throwing the exception - added a few lines for context). If I take jQuery migrate out, I still get the exception, just with less logging and error detail.

// Support for 'hover' pseudo-event and ajax event warnings jQuery.event.add = function( elem, types, handler, data, selector ){ if ( elem !== document && rajaxEvent.test( types ) ) { migrateWarn( "AJAX events should be attached to document: " + types ); } eventAdd.call( this, elem, hoverHack( types || "" ), handler, data, selector ); }; jQuery.event.remove = function( elem, types, handler, selector, mappedTypes ){ eventRemove.call( this, elem, hoverHack( types ) || "", handler, selector, mappedTypes ); };

gtwilliams03 commented 11 years ago

The problem is definitely a result of a stack overflow on calling the remove method of jQuery and the latest version of Bootstrap.

eirikluka commented 11 years ago

There are known issues with Bootstrap 2.3.0 and jQuery. If you update to 2.3.1 the problem should be solved.

gtwilliams03 commented 11 years ago

I upgraded to 2.3.1 and confirm that this problem goes away. Thanks for the heads-up and I will close this issue.