Support » How-To and Troubleshooting » [Resolved] Fading menu buttons

[Resolved] Fading menu buttons

  • Hey all, anyone know how I can get the menu buttons on my site to fade in and out smoothly when I hover over them. Not critical but it’d be a really nice finishing touch for my site I think πŸ˜‰


    Hope someone can help….

Viewing 7 replies - 1 through 7 (of 7 total)
  • Moderator Andrew Nevins


    Forum moderator

    Hello Mandody,

    Not sure if this is exactly what you are looking for, but you can try the following CSS code, and adjust the timing (.75s) to your liking.

    #branding ul.menu li:hover > a {
    -moz-transition: all .75s;
    -webkit-transition: all .75s;
    -o-transition: all .75s;
    transition: all .75s;



    Thanks for both replies πŸ™‚ eGriffinWebDesign – it almost worked perfectly! The text is fading in beautifully, but sadly the fade isn’t working on the box/background. Check it out: http://www.mandody.com

    Any ideas how I can get the box fading in too?

    I feel I’m getting close πŸ˜‰

    Many thanks again.

    OK…I’ve been playing around with CSS3 transitions (thanks for the link Andrew). Almost got it working, but for some reason when I hover over the menu items I still get the white block appearing…fade is working in the background but the white block obscures it. Hmmm?? How can I get rid of the white block rollover…been digging around in the code but can’t seem to find reference to it – but I am a newbie πŸ˜‰

    Looking great Mandody! I think to get it exactly how you want it you just need to change your CSS

    #branding ul.menu li:hover > a {
    background-color: #ffcc00;


    #branding ul.menu li:hover > a {
    background: #ffcc00!important;

    That should override the theme styles properly. Hopefully that works for you.



    Perfect! πŸ™‚ Thank you Michael. That worked a treat. Menu’s looking lovely πŸ˜‰

    Awesome! Glad I could help!



Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘[Resolved] Fading menu buttons’ is closed to new replies.
Skip to toolbar