Avatar for Username

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

This thread was archived. Please ask a new question if you need help.

After uploaded FF a hover status doesn't work

  • No replies
  • 1 has this problem
  • 4 views
GGKMNTN
GGKMNTN
more options

I've uploaded to the last version Firefox and after this a hover status doesn't work. I've noticed that the problem it's caused from the css rule transfomr-style:preserve-3d on his parent. If I remove this rule the hover status work, also in the oldest version of FF it work and also in others browsers.

http://www.jeanclaudechiementin.com/etoile/ristorante.html

If you go on the big image on the top page i should show you a custom cursor but on FF 46 it doesn't work.

HTML code:

Ristorante

CSS code:

  1. banner:hover:not(.home) { 
   cursor: url("img/zoom.cur"), auto;

} .parallax__layer--base { 

   bottom: 0;
   left: 0;
   position: relative;
   right: 0;
   top: 0;
   transform: translateZ(-1px) scale(2);

} .parallax__group { 

   height: 100vh;
   position: relative;
   transform-style: preserve-3d;

}

Can you help me to understand why on other browsers it work and on the latest FF no?

I've uploaded to the last version Firefox and after this a hover status doesn't work. I've noticed that the problem it's caused from the css rule transfomr-style:preserve-3d on his parent. If I remove this rule the hover status work, also in the oldest version of FF it work and also in others browsers. http://www.jeanclaudechiementin.com/etoile/ristorante.html If you go on the big image on the top page i should show you a custom cursor but on FF 46 it doesn't work. HTML code: <div class="parallax__group"> <div class="parallax__layer parallax__layer--base"> <div id="banner"> <ul> <li><img src="images/banner1.jpg" alt="" /></li> <li><img src="images/banner2.jpg" alt="" /></li> <li><img src="images/banner3.jpg" alt="" /></li> <li><img src="images/banner4.jpg" alt="" /></li> </ul> </div> </div> <div id="overlayer"> <h2>Ristorante</h2> </div> </div> CSS code: #banner:hover:not(.home) { cursor: url("img/zoom.cur"), auto; } .parallax__layer--base { bottom: 0; left: 0; position: relative; right: 0; top: 0; transform: translateZ(-1px) scale(2); } .parallax__group { height: 100vh; position: relative; transform-style: preserve-3d; } Can you help me to understand why on other browsers it work and on the latest FF no?