Jump to content

Marco Marinelli

SVG Draw - Slider not working on tablets

Moderator Tag

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


the slider does not run properly on iPad. I'd like to touch the slider as I do with the mouse but on iPad (I assume on Android tablets too) does not run. Any idea how to fix this issue? Thanks, K.

See the Pen VzQrpZ by kremisi (@kremisi) on CodePen

Link to comment
Share on other sites

That pen uses jQueryUI for the slider which isn't touch-enabled.

I haven't used it in awhile but this touch-punch utility used to solve the problem: http://touchpunch.furf.com/


Check out this demo that uses a native HTML5 input control. It should be touch-enabled by default:

See the Pen JGeagb?editors=0010 by GreenSock (@GreenSock) on CodePen


  • Like 2
Link to comment
Share on other sites

Great! Works like a charm :-)


the final js section is as follows:


    <script src="js/jquery.min.js"></script>
    <script src="js/jquery-ui.min.js"></script>
    <script src="js/TweenMax.min.js"></script>
    <script src="js/DrawSVGPlugin.js"></script>
    <script src="js/jquery.ui.touch-punch.min.js"></script>

    <script src="js/index.js"></script>


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.