user2574250
user2574250

Reputation: 79

Changing CSS display properties with jquery

This code allows me to hover over a div with class "steps-hover" and change from display: none (in my stylesheet) to display: block. Works perfect. But what if I want to change the display of a different class while hovering? That's where I am confused.

Ultimately I want to hover over the div "steps-hover", still retain the same results below but also change the css of a different div with class "default" to be display: none. Here is my current code:

function over(event) {
$('.steps-hover', this).stop(true, true, true).fadeIn(500);
$('.steps-hover', this).css("display", "normal");
}

function out(event) {
$('.steps-hover', this).stop(true, true, true).fadeOut(500);
}

So how do I add the changes to .default in there? I tried a couple different things, but no luck. My assumptions must be way off and I can't find the answer in the jquery API documentation. Thanks for any help!

Upvotes: 0

Views: 120

Answers (2)

Sbml
Sbml

Reputation: 1927

You can use too:

function over(event) {
$('.steps-hover', this).stop(true, true, true).fadeIn(500);
$('.default').hide();
}

function out(event) {
$('.steps-hover', this).stop(true, true, true).fadeOut(500);
}

Upvotes: 0

tymeJV
tymeJV

Reputation: 104775

Inside your over function, why not do:

$(".default").css("display", "none");

Upvotes: 1

Related Questions