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
  • 52,876
  • 38
  • 145
  • 202

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,758
  • 5
  • 52
  • 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,562
  • 1
  • 21
  • 31