CODEWITHSUNDEEP
javascriptjqueryhtmlhover
Nto
Nto

Reputation: 25

Change Div Property when hovering on another div?

So basically this is what I'm going to have:

<div id="1">
<div id="top"></div>
Text
Text
Text 
etc.

<div id="bottom"></div>
</div>

How would I go about doing the following: If someone hovers over div "1" (the entire container div) change the property of the "bottom" div (and only that bottom div) such as adding a class called "over".

I'm sure there's a way however I'm guessing it would need to use something such as jquery.

Upvotes: 1

Views: 1452

Answers (3)

Igor
Igor

Reputation: 33973

If you have jquery, then it is pretty simple (this worked for me):

$('#1').hover( function() {
    $('#bottom').addClass('over');
})

Upvotes: 1

JasCav
JasCav

Reputation: 34632

Yes, you are correct. You will need some jQuery to accomplish what you want to do.

The jQuery API documentation has the exact example you are looking for if you go and check out the hover function. Go to the bottom for an example. Adjust for your own code.

Upvotes: 1

kobe
kobe

Reputation: 15835

First thing is don't use numbers for div ids

$("#id").hover( //mouseover id
  function () {
  $("#bottom").addClass('classname') // this function is for mouse over
  }, 
  function () {
 // this is for mouse out
  }
);

Upvotes: 1

Related Questions