Changing CSS display properties with jquery

Question

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!

tymeJV · Accepted Answer · 2013-07-15 15:34:03Z

1

Inside your over function, why not do:

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

answered Jul 15, 2013 at 15:34

tymeJV

105k14 gold badges165 silver badges158 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

user2574250 Over a year ago

Perfect! I tried this before, but retained the .this in there like the previous line so it wasn't working. Now I need it to return to display block on mouse out. I tried $(".default").css("display", "normal"); , but not working.

tymeJV Over a year ago

@user2574250 -- $(".default").css("display", "block"); for the mouse out :)

Sbml · Accepted Answer · 2013-07-15 15:42:57Z

0

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);
}

answered Jul 15, 2013 at 15:42

Sbml

1,9172 gold badges17 silver badges27 bronze badges

1 Comment

user2574250 Over a year ago

Perfect! And I used $('.default').show(); on the out event to make it show up again. Thanks all!

Collectives™ on Stack Overflow

Changing CSS display properties with jquery

2 Answers 2

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related