SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Enthusiast
    Join Date
    Jul 2008
    Location
    Yorkshire, UK
    Posts
    38
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Slider form controler on iPad and Touch screens

    I've been playing with Kevin Yank/Cameron Adams slider control from Simply Javascript (pp248): http://onsitenow.co.uk/stuff/annuitycalculator/

    Has anyone got any advice on trying to get it to function on an iPad/touch screen.

    I've tried adding event listeners to ontouchstart, ontouchmove, ontouchend

    And I've tried to make my slider clickable by adding: slider.onclick = function(){void(0);};

    But I can't get it to work on touch screens.

    Is it possible, any advice?

    Thanks
    Mike

  2. #2
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,938
    Mentioned
    214 Post(s)
    Tagged
    12 Thread(s)
    Hi there,

    Quote Originally Posted by afuera View Post
    Has anyone got any advice on trying to get it to function on an iPad/touch screen.
    If you want to do this yourself, then this article shows you how to implement a range slider from scratch on a touch device: http://css3wizardry.com/2010/09/14/r...nd-javascript/

    Otherwise, if you don't mind using a library, jQuery mobile is the way to go: http://jquerymobile.com/demos/1.0b1/...ms-slider.html

    Let us know how you get on.

  3. #3
    SitePoint Enthusiast
    Join Date
    Jul 2008
    Location
    Yorkshire, UK
    Posts
    38
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Pullo,

    Thanks, those were the pointers I was looking for :-)

    I was hoping to avoid using a framework, as mobile devices may be working on smaller bandwidths, so my preference would be to do it with native javascript.

    I'll try the first tutorial first, though I notice it doesn't give a working example, just images of a slider, which is strange.

    If I can't get to grips with that I'll have a look at jquerymobile.

    Thanks for your suggestions.

    Mike

  4. #4
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,702
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    You may then want to consider a tiny library that's dedicated only to touch gestures on such devices, called Hammer.
    At the very least, it will also make it easier for you to carve out just the few parts of that library that you know you will have no use for, such as certain types of multi-touch gestures, if you want to cut down even further on space.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •