0

My code is as following:

.Frozenbg
{
    background-image:url('Images/Frozen.png');
    background-repeat:no-repeat;
    transition: background 1s linear;
    -moz-transition: background 1s linear; /* Firefox*/
    -webkit-transition: background 1s linear; /* Safari and Chrome */
    -o-transition: background 1s linear; /* Opera */
}

The problem is that I am adding class on hover and its working great which means it adds the class having background image with fade in effect that looks good, but the fade in /transition effect is not going on firefox and other browser please help me I am stuck in this problem from last night.

Toon Krijthe
  • 51,960
  • 37
  • 141
  • 201

2 Answers2

1

Transitions of background-image are not part of the spec yet. There's a proposal to do cross-fade for them, but it's still a pretty early draft.

Boris Zbarsky
  • 34,168
  • 5
  • 50
  • 55
0

Turns out there is a bug in Firefox (firefox hover opacity).

CSS3 transition/hover effect not working in Firefox; a Firefox bug?

Community
  • 1
  • 1
Danilo Kobold
  • 2,522
  • 1
  • 19
  • 30