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

Next Office Hours Session: "Implementing an SVG Icon System" Nov 30 - 6:00 PM Eastern

Scrolling background problem in FF

  • # August 28, 2011 at 6:21 pm

    Hi everyone!

    I was helping a buddy of mine whose in a band build a little wordpress site and I wanted to use something cool like the scrolling background Chris recently did an article on. My question is: why won’t the animations work in FF?? I even noticed that the Fiddle Chris had put together didn’t work either.

    Here’s the basic layout as I’m building it. I’m pretty much using the same structure as the demo:

    #viewport {
    background:transparent url('images/view-port.png');

    #scene {

    #scene > .slideshow {
    height: 120px;
    width: 1983px;
    background: url('images/scene-bg.jpg');
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;

    -moz-transition: opacity 0.5s ease-out;
    -o-transition: opacity 0.5s ease-out;
    -webkit-transition: opacity 0.5s ease-out;
    -ms-transition: opacity 0.5s ease-out;

    -webkit-animation: moveSlideshow 50s linear infinite;
    -moz-animation: moveSlideshow 50s linear infinite;

    @-webkit-keyframes moveSlideshow {
    0% { left: 0; }
    100% { left: -983px; }
    @-moz-keyframes moveSlideshow {
    0% { left: 0; }
    100% { left: -983px; }

    Is it even possible for this to flow into FF??

    # August 28, 2011 at 6:52 pm

    @joshwhite – It works since Gecko 5.0 release. Update firefox?

    # August 29, 2011 at 2:15 am

    This reply has been reported for inappropriate content.

    Well played sir. My version was the newest but after a reinstall everything worked just fine. Appreciate the response!

    # August 29, 2011 at 2:31 am

    @JoshWhite – maybe something similar is causing the dropbox issue we discussed privately? Hopefully the new invite takes care of that.

Viewing 4 posts - 1 through 4 (of 4 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