SVG Draw - Slider not working on tablets

[Marco Marinelli 2 Likes (Newbie)]

Hi,

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

[Carl 11,325 Likes (Superhero)]

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

 

[Marco Marinelli 2 Likes (Newbie)]

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>