CODEWITHSUNDEEP
javascriptjqueryhtmlcss
user1982011
user1982011

Reputation: 307

Adding Fade in when Hovering over Elements

I would like to add a slight fade in/fade out, when hovering over items here http://jsfiddle.net/7vKFN/

Was wondering whats the best way to do this using jquery

 var $container = $("#color-container"),
        $description = $(".color-description", $container).hide(),
        $prev;

    $(".color-units li", $container).mouseenter(function() {
        if ($prev)
           $description.eq( $prev.removeClass("active").index() ).hide();
        $description.eq( ($prev = $(this).addClass("active")).index() ).show();
    }).eq(0).mouseenter();

Upvotes: 0

Views: 44

Answers (1)

Mikkel Gunvald
Mikkel Gunvald

Reputation: 369

Is this what you mean?

http://jsfiddle.net/7vKFN/1/

$(".color-units li", $container).mouseenter(function() {
    if ($prev)
       $description.eq( $prev.removeClass("active").index() ).hide();
    $description.eq( ($prev = $(this).addClass("active")).index() ).fadeIn("slow", function() {
    // Animation complete
  })

}).eq(0).mouseenter();

Upvotes: 1

Related Questions