#1
  1. No Profile Picture
    .
    Devshed Newbie (0 - 499 posts)

    Join Date
    Dec 2002
    Posts
    296
    Rep Power
    15

    animated gifs on background animating?


    is there anyway to animate gifs that have been placed on the background by css?

    a usual, normal animated gif that has been placed on the background using css doesn't animate in the two browsers that i've tried. is there anyway to get gifs to animate while being background images rather than usual <img src... images?

    possible, or not on? just wondering. thanks.
  2. #2
  3. Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Apr 2003
    Location
    Italy, EU
    Posts
    517
    Rep Power
    15
    I've tried with IE6 and it works and with Opera7, where it doesn't.
    I think it's a browser problem and there's nothing to do...
    It seems the browsers that don't support the animation use the first frame of the gif: the only tip I can give you is to create your gif using as first frame an image that could work as static background.

    Cheers, Magma
  4. #3
  5. No Profile Picture
    .
    Devshed Newbie (0 - 499 posts)

    Join Date
    Dec 2002
    Posts
    296
    Rep Power
    15
    thanks for the reply

    well, it's good to know that at least some browsers do it. didn't know if any did.

    yeah you're right obviously about just making sure the first frame works ok not animating

    i'd be interesting to know roughly the amount of browser that do support that and those that don't.

    i assume you're using windows

    so that's windows:
    yes: IE6
    no: Opera7

    mac os x:
    no: IE5 & safari

    here's a small, simple test

    does the blue ball go from side to side, or not for anyone?
  6. #4
  7. |<.+#f@#+.&.|
    Devshed Frequenter (2500 - 2999 posts)

    Join Date
    Mar 2002
    Location
    norway
    Posts
    2,999
    Rep Power
    1226
    all under linux,

    mozillaFB 0.6 : yes
    konqueror 3.05: yes
    opera 7.11 :yes
  8. #5
  9. Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Apr 2003
    Location
    Italy, EU
    Posts
    517
    Rep Power
    15
    Under W2K it works both under IE6 and Opera7.03
    Mmm... I don't know why Opera didn't...

    Cheers, Magma
  10. #6
  11. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    May 2003
    Posts
    65
    Rep Power
    15
    Mac OS X: works in Camino and Firebird
  12. #7
  13. No Profile Picture
    .
    Devshed Newbie (0 - 499 posts)

    Join Date
    Dec 2002
    Posts
    296
    Rep Power
    15
    thanks for the replies.

    so it looks like a good percentage of browsers do manage to animate background images and i was just unlucky to have and try 2 that don't. that's great.

    the way i placed the image on the background in that example was like:
    Code:
    body {
    margin-top:0px;
    background:transparent
    url(leftrightball.gif)
    no-repeat
    top center
    }
    which is a pretty standard way of doing a background image, i think.

    if the animated gif were placed on the background using a z-image (safari fails to even show these types of images ) (using this method allows more than one backround image obviously) do you think that the browser success rate would be much the same?

    in other words does it make any difference to whether it animates or not, if the image is a css backround image, or a css z-index:-1 image?

    z-index test page (again with side to side animated blue circle)

    code from that page just for the hell of it:
    css bit:
    Code:
    .bgimage {
    position:absolute;
    height:100px;
    width:300px;
    z-index:-1
    }
    in the html bit:
    Code:
    <div class="bgimage" style="position:absolute; top:15px; right: 50%;">
    <img src="leftrightball.gif" width="300" height="100" />
    </div>
  14. #8
  15. No Profile Picture
    Contributing User
    Devshed Beginner (1000 - 1499 posts)

    Join Date
    May 2003
    Posts
    1,014
    Rep Power
    18
    On Linux:
    Mozilla (week old build) does NOT show the animation now (it does show it in the earlier version).
    Opera 6 and 7 show the animation in both versions.
  16. #9
  17. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    May 2003
    Posts
    65
    Rep Power
    15
    On Mac OS X:
    When z-index is used Safari, Camino, and Firebird do NOT show the graphic at all

IMN logo majestic logo threadwatch logo seochat tools logo