Before we start, you might want to move the script to the <head> section.
OK, so you want to hover over some entity with class item1 and change the
style on an entity with class item2. Here's the code:
<script type="text/javascript">
$(document).ready(function() {
$(".item1").hover(function() {
$(.item2).addClass("shift");
}, function() {
$(.item2).removeClass("shift");
});
});
</script>
Thats how I'd do it anyways :)
--Jacob
> I'm new to javascript and was looking to jquery to make things easier.
> I am sure this is a common and easy situation, but I am not sure how to
> solve it.
>
> I was just playing with the hover method below, and it works to
> alter the style of the .item1 divs when I hover over the .item1
> divs themselves. But how might i add a class to .item1 divs when
> instead hovering over the .container divs?
>
> Sorry for such a rudimentary question.
>
> <body>
> <style type="text/css">
> .test1 {height: 100px; width: 100px; background: red; color:
> black; margin: 5px;}
> .container {width: 400px; height: 120px; border: 1px solid
> black; margin: 5px; padding: 0px;}
> .shift {margin-left: 20px;}
>
> </style>
>
> <script type="text/javascript">
> $(document).ready(function() {
>
> $(".item1").hover(function() {
> $(this).addClass("shift");
> }, function() {
> $(this).removeClass("shift");
> });
>
> });
> </script>
>
> <div class="container">
> <div class="test1">
> <p>Little Red Box</p>
> </div>
> </div>
>
> <div class="container">
> <div class="test1">
> <p>Little Red Box</p>
> </div>
> </div>
>
> </body>
>
>
>
> --
> Bradford R. Bowman <[EMAIL PROTECTED]>
> GnuPG public key [0x3EE183C6]
> Available at http://pgp.mit.edu
>
> _______________________________________________
> jQuery mailing list
> [email protected]
> http://jquery.com/discuss/
>
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/
