table表随着鼠标移动背景变色(jQuery siblings())

jQuery siblings() 方法返回被选元素的所有同胞元素,并且可以使用可选参数来过滤对同胞元素的搜索。
实例1:

$(function(){
$("#table tr").mouseover(function(){
$(this).css("background-color", "#F4F4F4").siblings().css("background-color", "#FFFFFF");
});
});


实例2:
html代码:

<div class="dd">
<div class="dd-inner">
<div class="item fore1 hover" data-index="1" >
<h3><a target="_blank" href="www.baidu.com">建筑专业</a></h3>
<i>></i>
</div>
<div class="item fore2" data-index="2" >
<h3><a target="_blank" href="www.baidu.com">结构专业</a></h3>
<i>></i>
</div>
<div class="item fore3" data-index="3" >
<h3><a target="_blank" href="www.baidu.com">暖通空调专业</a></h3>
<i>></i>
</div>
<div class="item fore4" data-index="4" >
<h3><a target="_blank" href="home.html">家居</a></h3>
<i>></i>
</div>
<div class="item fore5" data-index="5" >
<h3><a target="_blank" href="1315-1342.html">男装</a></h3>
<i>></i>
</div>
<div class="item fore6" data-index="6" >
<h3><a target="_blank" href="beauty.html">个护化妆</a></h3>
<i>></i>
</div>
<div class="item fore7" data-index="7" >
<h3><a target="_blank" href="shoes.html">鞋靴</a></h3>
<i>></i>
</div>
<div class="item fore8" data-index="8" >
<h3><a target="_blank" href="sports.html">运动户外</a></h3>
<i>></i>
</div>
<div class="item fore9" data-index="9" >
<h3><a target="_blank" href="http://car.jd.com/">汽车</a></h3>
<i>></i>
</div>
<div class="item fore10" data-index="10" >
<h3><a target="_blank" href="//baby.jd.com">母婴</a></h3>
<i>></i>
</div>
<div class="item fore11" data-index="11" >
<h3><a target="_blank" href="food.html">食品</a></h3>
<i>></i>
</div>
<div class="item fore12" data-index="12" >
<h3><a target="_blank" href="//health.jd.com">医药保健</a></h3>
<i>></i>
</div>
<div class="item fore13" data-index="13" >
<h3><a target="_blank" href="//book.jd.com/">图书</a></h3>
<i>></i>
</div>
<div class="item fore14" data-index="14" >
<h3><a target="_blank" href="//caipiao.jd.com/">彩票</a></h3>
<i>></i>
</div>
<div class="item fore15" data-index="15" >
<h3><a target="_blank" href="//licai.jd.com/">理财</a></h3>
<i>></i>
</div>
</div>
</div>

js代码

$(function(){
$(".dd-inner .item").mouseover(function(){
$(this).siblings().removeClass("hover");
$(this).addClass("hover");
});
});

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值