Transition working in webkit not in mozilla

[Matteo]

Hello, I have this code for a drop-down menu, with a transition on the sub-menu:

ul.menu ul {

-moz-transition: visibility 0s linear .55s, opacity .55s linear 0s;

-webkit-transition: visibility 0s linear .55s, opacity .55s linear 0s;

-o-transition: visibility 0s linear .55s, opacity .55s linear 0s;

transition: visibility 0s linear .55s, opacity .55s linear 0s;

visibility: hidden;

opacity: 0;}



ul.menu li:hover > ul {

-moz-transition-delay:0s;

-o-transition-delay:0s;

-webkit-transition-delay:0s;

transition-delay:0s;

visibility: visible;

opacity: 1; }

It displays properly in Chrome but not in Firefox (7.0.1): why?
Another transition changing background-color on another elemet works fine and a similar transition (http://www.greywyvern.com/?post=337 credit for the idea!) works as well in FF.

[Paulie_D]

Is visibility something you can transition?

Isn’t it a binary state (on/off)?

I know you can transition opacity…could that be the issue?

[Matteo]

Thanks for your replies, tried the 550ms before but didn’t work, and yes you can transition visibilty (as per the link I’ve posted, furthermore the transition works in webkit browsers…).
I’m a bit lost.

M

[Paulie_D]

This may help: http://www.greywyvern.com/?post=337

[Matteo]

I’m using 7.0.1 for Ubuntu: I think this version still uses the prefixed version but I’m not 100% sure (although I’ve tried both versions and none seems to work)

[Matteo]

Try this address: matteovegetti.com
User: guest
pw: guest123

Still work in progress, many things are misplaced and on the menu itself there is an offset I must correct.

The animation works fine in Chrome though…

[Matteo]

Hey Cliff,

I really appreciate your efforts but it is not working on my site… yes the jsfiddle works fine but even implementing your code my menu sadly does not…

[Matteo]

I’m almost ashamed to say… no, I don’t.
Same as before, working in Chrome, not in FF.

[Matteo]

Finally!
By removing the first pseudo :hover element to ul.menu li and associating the .hover class (for whatever reason) made it to work! :-)
Thanks anyway Cliff

[Author]

Posts