0

I have a parent div, which contains two other Divs and I'm looking to animate the background-image of the parent div so that it constantly scrolls along the x-axis. The image is 3840px wide and the div is 100% of the browser (1920px). Essentially the image needs to repeatedly scroll whilst not impacting upon the child elements within the parent div, is this possible?

Here is my HTML

<div id="SliderBackground">
    <div id="SliderBanner"></div>
    <div id="SliderStaticImage"></div>
</div>

Here is my CSS

#SliderBackground
{
    width:100%; /*1920px*/
    height:500px;
    background-image:url(Background.png);
    z-index:-1;
    position:absolute;
    top:90px;
}

Thankyou in advance.

Michael Duker
  • 35
  • 3
  • Try searching, "CSS background animation". – Zach Saucier Feb 11 '15 at 16:55
  • 1
    possible duplicate of [CSS background-position animate right to left](http://stackoverflow.com/questions/22781569/css-background-position-animate-right-to-left) – Timothy Groote Feb 11 '15 at 16:56
  • Thankyou for your answers guys, near enough got it sorted. I'm trying to animate a single background image in a div which includes two background images (clouds moving left on a static background) and just looking for the answer to animate one background-image. – Michael Duker Feb 12 '15 at 17:37

0 Answers0