jquery鼠标移入变色移出恢复

一、需求说明

现需要对一个表格的内容部分做下高亮处理：当鼠标放到这一行时，背景色发生改变；当鼠标移出这一行时，恢复这一行的原有背景色。如下图，原来是除了首行以外，带序号的内容部分，奇偶行背景色交替变化，当鼠标放到第1行时，看到下图的样式，移出该行后，恢复原样。

二、代码实现

table及样式部分：

关键点：1.给table添加边框 2.奇偶行颜色交替

js代码部分：

关键点：

弄清实现思路：移入时需要a.获取该行原有背景色 b.给该行添加新的背景色；移出时，恢复改行原有背景色

jquery鼠标移入变色移出恢复相关推荐

js(jquery)鼠标移入移出事件时，出现闪烁、隐藏显示隐藏显示不停切换的情况
<script> $(".guanzhu").hover(function(){$(".weixinTop").show();},function( ...
vue的鼠标移入和移出
vue的鼠标移入和移出需求(鼠标到预约二维码显示,预约添加背景色) 实现  <ul class="person_list"> / ...
Jquery鼠标点击后变色，点击另一个按钮颜色还原
Jquery鼠标点击后变色,点击另一个按钮颜色还原 <script type="text/javascript" src="http://code.jquery.c ...
JS鼠标移入，移出事件
该事件的效果就像百度首页的设置选项,当鼠标移入,移出时的效果,废话不多说了,直接上码. <!DOCTYPE html> <html lang="en"> & ...
jQuery鼠标移入移出(冒泡版和无冒泡版)
带冒泡事件的鼠标移入移出(默认的):mouseover和mouseout事件没有冒泡事件的鼠标移入移出:mouseenter和mouseleave事件转载于:https://www.cnblogs ...
前端 jQuery鼠标移入移出
mouseover() 鼠标进入(进入子元素也触发) mouseout() 鼠标离开(离开子元素也触发) mouseenter() 鼠标进入(进入子元素不触发) mouseleave() 鼠标离开(离 ...
js中jquery鼠标事件（点击替换、鼠标移入、移出）
1.先添加三张图片 <img src="./vscode/images/1.jpg" width="300"><img src=". ...
表格元素的快捷获取以及隔行变色、鼠标移入变色案例
要求:以下列代码为基础,添加JS代码,令表格实现隔行变色效果,并且实现鼠标移入表格,该行表格背景色变为绿色,移出表格后表格恢复为原隔行变色形式的背景色. <table id='tab1' bor ...
CSS实现当鼠标移入或者移出时实现动画过渡效果
现在需要完成这样一个需求在鼠标移入一个按钮时,需要有一个从下到上慢慢改变背景颜色以及字体颜色的动画效果,再鼠标移出的时候,也要有一个从上到下慢慢变回原来动画的过渡效果因为不会截动态图,因此用每个步 ...

jquery鼠标移入变色移出恢复

jquery鼠标移入变色移出恢复相关推荐

最新文章

热门文章