<script type="text/javascript">
$(function(){
var obj = $(".item");
var alert = $(".alert", obj);
obj.hover(function() {
alert.hide(500);
}, function() {
alert.show(500);
});
});
</script>
On Sun, May 17, 2009 at 12:16 PM, napalm <butt...@gmail.com> wrote:
>
> Hi All,
>
> I have 3 divs with the same name wrapped in a container.
> Each div includes a span.
> At the moment, when you hover over a div, its displays all spans.
>
> What i want is if you hover over a specific div, i would like to
> display it's span only.
> Is this possible ?
>
> <html>
> <head>
> <script type="text/javascript" src="jquery.js"></script>
>
> <script type="text/javascript">
> $(document).ready(function(){
> $('.alert').hide();
>
> $(this).hover(
> function () {
> $(".alert").show('slow');
> },
> function () {
> $(".alert").hide('slow');
> }
> );
> });
> </script>
> <style type="text/css">
> #container{
> width: 600px;
> height: 300px;
> }
> .item{
> float: left;
> width:200px;
> height:300px;
> }
> </style>
> </head>
>
> <body>
> <div id="container">
> <div class="item">
> <p>this is an item</p>
> <span class="alert">Here is a warning</span>
> </div>
> <div class="item">
> <p>this is an item</p>
> <span class="alert">Here is a warning</span>
> </div>
> <div class="item">
> <p>this is an item</p>
> <span class="alert">Here is a warning</span>
> </div>
> </div>
> </body>
> </html>
>
> Thanks in advance
>
