Firefoxのバグ:透過アニメーションGIFをCSSで背景指定

Mac OSX / Firefox 1.5で再現性を確認。
Windows / Firefox 2.0では問題無し。

元アニメーションGIF
サンプルGIFアニメ
横100px × 縦50px,3フレーム。
2,3フレームは右側を透過(透明)にしている。

上記のアニメーションGIFをCSSで背景画像で指定してみる。

ここには面倒だったのでインラインで指定してます。

Mac OSX / Firefox1.5の環境だと、2フレーム目だけの右側の透過部分が幅が無いように認識されてリピートされてしまう。

CSSでの指定はこんな感じ。

#bg_gif{
width:100px;
height:50px;
text-indent:-1000px;
background:url(gif_anime.gif) no-repeat;
}

回避策は透過させない事ぐらいしかなかった。。。うーん。 MAC OSX/Firefox2.0で解消されてるかは今度検証してみます。

追記 ) 2007/03/04
Mac OSX 10.4.8 / Firefox2.0.0.2の環境でも現象の再現を確認しました。
うーん。。。

  • URLをコピーしました!

この記事を書いた人

どうでもいいことばかりです

コメント

コメントする