隔行一色鼠标移动变色

最新推荐文章于 2022-12-17 08:56:34 发布
最新推荐文章于 2022-12-17 08:56:34 发布
阅读量104 收藏
点赞数
分类专栏： Html 文章标签： JavaScript XHTML CSS HTML ViewUI 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>test</title> 
<style language="text/css"> 
/*第一种颜色*/ 
#table tr.color1{ 
background-color:#FFFFFF; 
} 
/*第二种颜色*/ 
#table tr.color2{ 
background-color:#F8F8F8; 
} 
</style> 
<script type="text/javascript"> 
<!-- 
function onloadEvent(func){ 
var one=window.onload 
if(typeof window.onload!='function'){ 
window.οnlοad=func 
} 
else{ 
window.οnlοad=function(){ 
one(); 
func(); 
} 
} 
} 
function showtable(){ 
var tableid='table'; //表格的id 
var overcolor='#FCF9D8'; //鼠标经过颜色 
var color1='#FFFFFF'; //第一种颜色 
var color2='#F8F8F8'; //第二种颜色 
var tablename=document.getElementById(tableid) 
var tr=tablename.getElementsByTagName("tr") 
for(var i=1 ;i<tr.length;i++){ 
tr[i].οnmοuseοver=function(){ 
this.style.backgroundColor=overcolor; 
} 
tr[i].οnmοuseοut=function(){ 
if(this.rowIndex%2==0){ 
this.style.backgroundColor=color1; 
}else{ 
this.style.backgroundColor=color2; 
} 
} 
if(i%2==0){ 
tr[i].className="color1"; 
}else{ 
tr[i].className="color2"; 
} 
} 
} 
onloadEvent(showtable); 
--> 
</script> 
</head> 
<body id="" class=""> 
<table width="100%" border="0" cellspacing="1" cellpadding="4" class="list" name="table" id="table"> 
<thead> 
<tr> 
<th>流程</th> 
<th>启动人</th> 
<th>启动时间</th> 
<th>状态</th> 
</tr> 
</thead> 
<tbody> 
<tr> 
<td><a href="">测试行</a></td> 
<td>无</td> 
<td>2008-05-09 17:21:04</td> 
<td>结束</td> 
</tr> 
<tr> 
<td><a href="">测试行</a></td> 
<td>无</td> 
<td>2008-05-09 17:21:04</td> 
<td>结束</td> 
</tr> 
<tr> 
<td><a href="">测试行</a></td> 
<td>无</td> 
<td>2008-05-09 17:21:04</td> 
<td>结束</td> 
</tr> 
<tr> 
<td><a href="">测试行</a></td> 
<td>无</td> 
<td>2008-05-09 17:21:04</td> 
<td>结束</td> 
</tr> 
<tr> 
<td><a href="">测试行</a></td> 
<td>无</td> 
<td>2008-05-09 17:21:04</td> 
<td>结束</td> 
</tr> 
<tr> 
<td><a href="">测试行</a></td> 
<td>无</td> 
<td>2008-05-09 17:21:04</td> 
<td>结束</td> 
</tr> 
<tr> 
<td><a href="">测试行</a></td> 
<td>无</td> 
<td>2008-05-09 17:21:04</td> 
<td>结束</td> 
</tr> 
<tr> 
<td><a href="">测试行</a></td> 
<td>无</td> 
<td>2008-05-09 17:21:04</td> 
<td>结束</td> 
</tr> 
<tr> 
<td><a href="">测试行</a></td> 
<td>无</td> 
<td>2008-05-09 17:21:04</td> 
<td>结束</td> 
</tr> 
<tr> 
<td><a href="">测试行</a></td> 
<td>无</td> 
<td>2008-05-09 17:21:04</td> 
<td>结束</td> 
</tr> 
</tbody> 
</table> 
</body> 
</html>

 

YUANBO120805696
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
java中表格隔行变色_【JavaWeb】TableDemo 表格隔行显色+鼠标悬停高亮显示
weixin_30784365的博客
02-24 882
【普通表格-非隔行显色】approach1window.onload = function () {//#-----非隔行显色---需要css辅助-------------------------------------------function mouseover (){var rows = document.getElementsByTagName('tr');//取得行for(var i=...
基于jQuery的的一个隔行变色，鼠标移动变色的小插件
10-29
基于jQuery的的一个隔行变色，鼠标移动变色的小插件，学习jquery的朋友可以参考下。
一眼就会table隔行换色、table表头固定、隔行色、鼠标移动行换色
刘贵庆的博客
08-24 4888
抽出时间整理笔记：table头部固定、超出宽度可横向移动，主信息隔行换色、鼠标移动变色。举例： code : <!DOCTYPE HTML> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Table表头固定</title> <style> #div { .
Jquery-01-隔行换色鼠标指向表格并且行变色
此后如竟没有炬火我便是唯一的光
08-19 1049
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script src=.
JS-隔行换色+鼠标移上去变色
weixin_45959965的博客
12-17 786
JS-隔行换色+鼠标移上去变色
layui的表格table选中数据后更改本行的颜色
10-17
在layui的表格table中，选中某行数据之后更改本行颜色，取消选中后恢复原样式。在layui的表格table中，选中某行数据之后更改本行颜色，取消选中后恢复原样式。
JQuery&CSS;&CSS;+DIV实例大全.rar
08-13
25.jquery鼠标移动出现下拉菜单及提示特效代码 26.jquery外国滚动型多级展开菜单插件(jGlideMenu)下载 27.jquery自由滚动切换 标签式导航菜单示例 28.博客Blog横向jquery动态滑动菜单插件示例 29.打包50种...
JavaScript网页特效范例宝典源码
09-04
实例177 当鼠标移动到超级链接时改变超级链接颜色 277 实例178 改变超级链接背景色 278 6.2 超级链接控制 279 实例179 建立E-mail超级链接 280 实例180 获取页面中的全部超级链接 281 实例181 将网站设为首页 282 ...
2322140088-0b2a877d-bae9-4a8f-9267-bef87d63dd3a (1).zip
06-17
2322140088-0b2a877d-bae9-4a8f-9267-bef87d63dd3a (1).zip
简历精美模板酷黑炫彩.zip
06-17
在求职的征途上，一份出色的简历是你通往梦想职位的敲门砖。我们精心准备了一系列面试求职简历模板，旨在帮助你以最佳形象站在潜在雇主面前。这些简历模板不仅设计精美，而且注重内容的清晰呈现，使招聘经理一目了然地看到你的能力和经验。 我们的模板集合了多种风格与布局，无论你是应届毕业生、职场跳槽者还是行业专家，都能在这里找到适合你职业形象的简历设计。每一个模板都经过精心设计，确保你的简历在众多求职者中脱颖而出，同时保持足够的专业度和可读性。 不仅如此，我们的简历模板易于编辑，你可以根据具体职位需求快速调整内容，展现你的个人优势和职业成就。使用这些模板，将大大提高你的面试机会，并帮助你更好地表达自己的价值和潜力。 别让传统且缺乏创意的简历阻碍你迈向成功的道路。立即下载这些精美的简历模板，让你的求职之路更加顺畅，向心仪的工作迈进吧！记住，一个良好的开始是成功的一半，而一份精致的简历，正是你成功的起点。
protobuf-3.12.1-cp37-cp37m-win_amd64.whl
06-17
Python库是一组预先编写的代码模块，旨在帮助开发者实现特定的编程任务，无需从零开始编写代码。这些库可以包括各种功能，如数学运算、文件操作、数据分析和网络编程等。Python社区提供了大量的第三方库，如NumPy、Pandas和Requests，极大地丰富了Python的应用领域，从数据科学到Web开发。Python库的丰富性是Python成为最受欢迎的编程语言之一的关键原因之一。这些库不仅为初学者提供了快速入门的途径，而且为经验丰富的开发者提供了强大的工具，以高效率、高质量地完成复杂任务。例如，Matplotlib和Seaborn库在数据可视化领域内非常受欢迎，它们提供了广泛的工具和技术，可以创建高度定制化的图表和图形，帮助数据科学家和分析师在数据探索和结果展示中更有效地传达信息。
基于51单片机实现的播放音乐
06-17
# c51-play-music 51单片机播放音乐 ## 编译方法 ### 蜂鸣器 1. 将mml2beep-master放到`scripts/beep.json` 2. 运行`scripts/tone_to_loop_count.py` 3. 编译`beep/beep.uvproj` ### DA转换 1. 将音频文件剪辑到大约10秒，重采样到大约5000Hz采样率，保存到`scripts/flower dance.wav` 2. 运行`scripts/wav_to_code.py` 3. 编译`dac/dac.uvproj` ### PWM 1. 将音频文件剪辑到大约10秒，重采样到大约5000Hz采样率，保存到`scripts/flower dance.wav` 2. 运行`scripts/wav_to_pwm.py` 3. 编译`pwm/pwm.uvproj`
简历模板简洁风简洁干练简历模板简历模板简洁风(简历模板-).zip
06-17
在求职的征途上，一份出色的简历是你通往梦想职位的敲门砖。我们精心准备了一系列面试求职简历模板，旨在帮助你以最佳形象站在潜在雇主面前。这些简历模板不仅设计精美，而且注重内容的清晰呈现，使招聘经理一目了然地看到你的能力和经验。 我们的模板集合了多种风格与布局，无论你是应届毕业生、职场跳槽者还是行业专家，都能在这里找到适合你职业形象的简历设计。每一个模板都经过精心设计，确保你的简历在众多求职者中脱颖而出，同时保持足够的专业度和可读性。 不仅如此，我们的简历模板易于编辑，你可以根据具体职位需求快速调整内容，展现你的个人优势和职业成就。使用这些模板，将大大提高你的面试机会，并帮助你更好地表达自己的价值和潜力。 别让传统且缺乏创意的简历阻碍你迈向成功的道路。立即下载这些精美的简历模板，让你的求职之路更加顺畅，向心仪的工作迈进吧！记住，一个良好的开始是成功的一半，而一份精致的简历，正是你成功的起点。
AVS之MRM（Multi-Room Music）文档
06-17
AVS之MRM（Multi-Room Music）文档
Uibot (RPA设计软件）财务会计Web应用自动化(批量开票机器人）
06-17
Uibot (RPA设计软件）RPA基础培训-财务会计Web应用自动化(批量开票机器人）
JS爬虫和逆向JS爬虫和逆向
06-17
JS爬虫和逆向JS爬虫和逆向
protobuf-3.15.7-cp39-cp39-macosx_10_9_x86_64.whl
最新发布
06-17
Python库是一组预先编写的代码模块，旨在帮助开发者实现特定的编程任务，无需从零开始编写代码。这些库可以包括各种功能，如数学运算、文件操作、数据分析和网络编程等。Python社区提供了大量的第三方库，如NumPy、Pandas和Requests，极大地丰富了Python的应用领域，从数据科学到Web开发。Python库的丰富性是Python成为最受欢迎的编程语言之一的关键原因之一。这些库不仅为初学者提供了快速入门的途径，而且为经验丰富的开发者提供了强大的工具，以高效率、高质量地完成复杂任务。例如，Matplotlib和Seaborn库在数据可视化领域内非常受欢迎，它们提供了广泛的工具和技术，可以创建高度定制化的图表和图形，帮助数据科学家和分析师在数据探索和结果展示中更有效地传达信息。
2225060346-汤岚淇-实验报告4.doc
06-17
2225060346-汤岚淇-实验报告4
DOM案例之-----------隔行变色、鼠标移动变色
09-01
对于隔行变色和鼠标移动变色的 DOM 案例，我可以为你提供相关代码。下面是一个简单的示例： HTML 代码： ```html <th>Header 1 <th>Header 2 <th>Header 3 <td>Row 1, Cell 1 <td>Row 1, Cell 2 <td>...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值