Scriptaculous Slider for iPhone, iPad and iPod Touch

JavaScript libraries to help with Ajax functionality are wonderful things; I tend to use jQuery for new projects, but in the past I’ve been heavily reliant on Prototype/Scriptaculous and still maintain a number of sites myself using these libraries.

One of the handy features Scriptaculous provides is an interactive slider; you can use this for setting price ranges and so on and it works really well. Unfortunately it doesn’t work on touch screen devices, which can lead to considerable frustration for users on those devices who try and interact with the slider elements on your website.

The good news is, the fix for this is very simple. A patch was originally posted on Github a couple of years ago and having tried this myself on a few sites, it works fine, including on sliders with multiple handles.

I have uploaded a minified slider.js file to my blog for your convenience; click here to download it. Simply unzip and replace your existing slider.js file. Visitors to your website on touch screen devices, such as the iPhone, iPad or iPod Touch, will now be a whole lot happier :)

This entry was posted in Code Snippets.