LoginSignup
5
5

More than 5 years have passed since last update.

【Firefox】画像をfadeすると、画像の大きさが変になるのを直す

Last updated at Posted at 2014-02-17

jQueryのfadeかCSSで透過(opacity)を行うと、Firefoxで画像の大きさが変になることがある。

発生条件

  • Firefox(確認したバージョンは27.0.1だが、結構昔からあるバグのよう)
  • jpg、gif 、png24で確認
  • jqueryは2.1.0-1.4.2あたり

CSSで直す

img {
    box-shadow: #000 0 0 0;
}

参照:http://stackoverflow.com/questions/13289109/jquery-fadein-fadeout-image-difference-1px-in-firefox

IE7以下に対応するとき

CSSで直す場合、そのまま使うとIE7以下ではfadeが効かない不具合があるので、CSSハックで対応する。

img, x:-moz-any-link, x:default {
    box-shadow: #000 0 0 0;
}

デモ:http://jsdo.it/Ituki/r6Xw

5
5
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
5
5