Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS jQuery SlideDown & css transition with height – jerky on mobile

  • This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #46553
    shoxv
    Participant

    Hi Guys,
    I tried researching this but can’t really find a solution. I’m hoping you guys can help.

    So I’m trying to do a simple slidedown menu nav thing, using jquery slideToggle. It works good, but on iPhone/galaxy s3 the slide down is super jerky. Like you see maybe 4 ‘frames’ for the whole slide down.

    I tried setting the height and doing a CSS 3 transition on height, but had the same issue.
    I have no idea what’s causing this.. I tried stripping out margins, paddings, etc, but it doesn’t help.

    Could anyone help me out?

    Thanks!

    #143588
    swen
    Member

    I had the exact same problem and could not fix it.

    The problem is that jquery slideUp/Down and css3 transition aren’t hardware accelerated. So the animation and reflow of the the DOM elements is computed by the mobile cpu which still isn’t powerful enough.

    If you find a way to use css3 transform, you are good to go, because this property is hw accelerated and will be smooth even on mobile devices.

    I didn’t find a way to use transform (translateX or something like that) for an accordion site.

    Hope that helps a little.

Viewing 2 posts - 1 through 2 (of 2 total)
  • The forum ‘CSS’ is closed to new topics and replies.