The Lodge is members-only design/dev videos and Office Hours.

Next Office Hours Session: "Programming Fundamentals" Dec 02 - 2:00 PM Eastern

Keyframe animation and background-attachment fixed

  • # April 26, 2013 at 2:58 pm

    Hi All,
    Hope someone can help me with this:

    I’m working on a one page layout site with some keyframe animations and a couple of fixed background images that are overlayd when you scroll down.

    Oddly (or not), i can’t manage for the background-attachment:fixed to work with keyframes animations:

    If i remove the animation, the background-attachment works fine:

    Any idea why this is happening?

    Thanks in advance,

    # April 26, 2013 at 4:02 pm

    I’m not sure if i fully understand. Can you explain what your trying to achieve better? and maybe use codepen.

    # April 26, 2013 at 4:59 pm

    Yeah I’m with Jarolin, I don’t really get what your trying to accomplish with this or what you need us to help with. [This]( ) might help you out a little bit.

    # April 29, 2013 at 2:49 pm

    Well, i’m trying to overlay two images, using background-attachment: fixed, like on this example:

    The problem is that when i add a keyframe animation css on a div in the top, the background-attachemnt:fixed no longer works.

    Like on this example:
    (the .mask class has the background-attachment:fixed and the .scaleAnimation has the keyframe animation).

    On this example: you can see the background-attachment: fixed working (same code, but without keyframe animations).

    Hope you understand…


    # April 30, 2013 at 6:29 am

    I’ve solved the problem… It was a damn relative position!
    Thanks anyway for your support

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

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed