Grow your CSS skills. Land your dream job.

how do you deal with touch events

  • # July 14, 2013 at 11:14 am

    hello so how are poeple dealing with taps and scrolls on the tablets and smart phones?

    so far ive been using jquery and I do something like this based on things ive read I strung this together:

    http://codepen.io/shamai/pen/txrok

    so how do you use touch event cause this might look a bit like over kill.
    basically I check if its a moblie device, then use ‘click’ or ‘touchstart’.

    then after touchstart I add a touchend so the event fires right away. or I decide what to do on scroll although I have never dealt with the scroll direction…

    ive never used jquery mobile… it looks more look jquery ui which I dont either use… i like styling and making thi stuff myself if i can

    # July 14, 2013 at 11:38 am

    I’ve never had to bother with touch ? It should work just with click on mobile as well you shouldn’t need to detect the browser and that would be nightmare to update anyway.

    # July 14, 2013 at 11:40 am

    no, click takes 3 or four seconds to work so it looks like it has lag… because its waiting to see if you do something else besides click

    see here is the same code just no touchstart or end or any touch events… watch on your mobile device the difference between the codpen above and this one:

    http://codepen.io/shamai/pen/ayheD
    notice this one lags a bit?

    # July 14, 2013 at 12:30 pm

    I just tested this out, and it seems that your original code does not transition and the code I suggested works as expected ? I don’t know what you mean by a 3 or 4 second wait, for me it works instantly on iOS.

    # July 14, 2013 at 12:38 pm

    try them now. i changed the link.
    notice the first one is a smooth fast tap and it works instantly!
    the second one using just click has you tap… then you wait a few seconds and people usually tap again. this makes it open then close real fast!

    # July 14, 2013 at 4:10 pm

    Okay for me, I **do** notice a slight increase in responsiveness with your code however the simple click is not much different. It is only slightly slower.

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".