The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums Other JavaScript hover fade.

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #22532

    I am new to JavaScript and I am not very good at programming but I want to be able to have a few lines of simple code that will generate a fading hover effect that I could put on some navigation such as the top navigation in and in

    Anything helps and I would love if you could add some comments to the code so I can actually learn what does what.
    Thanks! :]
    Brendan Wright

    Chris Coyier

    Using jQuery you can do fade in and outs super easily. I’m just learning, but it would go something like this:

    $(.button).each(function(){ // everything with class=”button”
    $(this).click(function(){ // when clicked
    $(this).fadeOut(); //fades out

    You could have something behind it that it fades into, which when clicked or hovered or something, would fade back in the original. I am FAR from an expert on this, but thems the basics. You’ll have to include jQuery as a script on your page before you call this (from within another script tag).


    Hi Tob, thank you for sharing this script! I am completely at the beginning of jQuery and mootools.
    I noticed that in firefox the hover appears twice though? Any suggestions? Thank you so much in case you have time to answer this!

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘Other’ is closed to new topics and replies.