How do I make a JQuery Slider-like feature on iPhone/Android web app?

In the iPhone or Android, if you have a JQuery Slider, it doesn't quite work (touchscreen will move 开发者_运维技巧the screen instead of drag the slider.)

---

You may need to write this from scratch. Luckily, @ppk has coded up an example of drag and drop for iPhone.

---

Listen for touch events and move the slider accordingly. These events also work on Android as it also uses WebKit.

---

You can use this library http://touchpunch.furf.com/ This provides touch events for all the jquery ui elements.

---

I found sample code online which converts touch events to mouse events. I tested this with jquery-ui's slider and it worked nicely!

Link to source

---

You can do this for iphone, android and windows phones via jquery+javascript. Windows phone with IE has one flaw, I have not been able to get it to snap to div sections.

---

I used this to wire up http://code.google.com/p/jquery-ui-for-ipad-and-iphone/ the slider. Works like a charm, just be sure to replace the code that works against specific dom elements. Then add $('#sliderdiv').addTouch (). Works on IPhone, but doesn't work for Android. According to quirksmode touch events don't work on Android.