CODEWITHSUNDEEP
jqueryparent-child
ekedin
ekedin

Reputation: 43

How do you only fade a specific element in a parents children with JQuery?

How would you make it so the P inside each .nav didn't fade?

http://jsfiddle.net/vbqfD/

$(document).ready(function () {
$('.nav').mouseenter(function () {
    $(this).fadeTo('fast', .5);
});

$('.nav').mouseleave(function () {
    $(this).fadeTo('fast', 1);
});

});

Upvotes: 2

Views: 75

Answers (1)

Ram
Ram

Reputation: 144659

You are setting opacity of the element to 0.5, this affects the children too, I'd suggest:

.nav {
    ... 
    background: rgba(130, 202, 255, 1);
    -moz-transition: all 400ms;
    -webkit-transition: all 400ms;
    transition: all 400ms;
}

.nav:hover {
    background-color: rgba(130, 202, 255, 0.5);
}

http://jsfiddle.net/NwRXs/3/

Upvotes: 1

Related Questions