Jump to content

Gary Griswold

Draggable scrolling in Cordova/Phonegap

Moderator Tag
Go to solution Solved by Gary Griswold,

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts



I am developing a cordova/phonegap application for iOS and Android, and I am trying to use Draggable for scrolling to overcome some problems with iOS native scrolling in cordova.


I am not seeing any movement when pressing and dragging the screen even though the onPress and onDrag are firing.


I have noticed in the documentation that height must be set somewhere, but please be specific about where and with what javascript (not jquery) functions.  I can verify that offsetHeight has already been set on the div you added and the value looks correct.  Is there something else to set?


If that is not the problem, other things that might be a cause are that I am doing an infinite scroll of text, and since the user can jump around, the Draggable is created when there is no content, because the parts being presented in the scrolling viewport are frequently deleted and other pages added.  Plus as the user scrolls forward or back new pages are added to the beginning or end.


To date I am seeing Draggable work with my application running under Node/Webkit, but when I move the same code to a cordova (phonegap) application nothing moves.


If Draggable scrolling is known to work with Cordova, please let me know and I will try to put together a test that could be presented in codepen.



Link to comment
Share on other sites

I've never used Cordova, so I'm not entirely sure how it might be interfering and it'd be tough to troubleshoot blind but if there's any way you can provide a sample codepen that demonstrates the issue, we can definitely dig into that. 


One other thing you could try is if you're dynamically adding/removing content, you could recreate the Draggable instance after you do your removing/adding of content so that when Draggable does its magic, it's on real content that's actually there :) You could also try calling its update() method.

Link to comment
Share on other sites

  • Solution



Thanks.  The update() function call does help, and it seems that I need to do the Draggable create after I have added the starting content.  But there is still a problem that is caused by a weakness in Cordova.  It appears that Cordova is linked to the older (pre ios 8) UIWebView, not the new WKWebView.  So, even using Draggable with Cordova I get the pre iOS 8 behavior of no Javascript updates and no screen painting while the view UIWebKit is scrolling.  With this limitation in Cordova, I will not be able to add and remove content dynamically unless I wait till scrolling stops at the end of the viewport.


The following link describes the problem with Cordova at the end of the writeup.  Thanks for your help.




  • Like 2
Link to comment
Share on other sites

Bummer - hopefully Cordova will update things on their end. Thanks for letting us know about your success (and Cordova-specific challenges)

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.