郁闷吧
懒人建站QQ群：4188479 63242849 39070147 130690866
懒人建站
主页
JS代码
导航菜单
焦点幻灯片
广告代码
网页特效
jquery 特效
滚动代码
建站技巧
威客网排行榜
用户体验设计
html+css
html+css技巧
html+css布局实例
html+css模板
兼职网站大全
当前位置：
懒人建站
>
JS代码
>
网页特效
>
隔行换色+单击表格行变色
关键字：
隔行换色
表格特效
表格可以隔行换色，当鼠标划过表格行的时候表格行也会变色，当单击表格行的时候表格也会变色。
查
隔行换色+单击表格行变色
看
隔行换色+单击表格行变色
演示
·
进入下载地址列表
收 藏
相关代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>各行换色+单击表格行变色- 懒人建站-51xuediannao.com</title> <style type="text/css"> <!-- #ejiaA1 { width: 550px; border-top: #E3E3E3 1px solid; border-left: #E3E3E3 1px solid; } #ejiaA1 td,#ejiaA1 th { padding: 5px;border-right: #E3E3E3 1px solid; border-bottom: #E3E3E3 1px solid; font-size:12px; height:16px; line-height:16px; } #ejiaA1 tr td span {color: #686868} #ejiaA1 tr td span.st1 {color: #ff0000} --></style> <script language="javascript"><!-- function ejiaA1(o,a,b,c,d){ var t=document.getElementById(o).getElementsByTagName("tr"); for(var i=0;i<t.length;i++){ t[i].style.backgroundColor=(t[i].sectionRowIndex%2==0)?a:b; t[i].onclick=function(){ if(this.x!="1"){ this.x="1";//本来打算直接用背景色判断，FF获取到的背景是RGB值，不好判断 this.style.backgroundColor=d; }else{ this.x="0"; this.style.backgroundColor=(this.sectionRowIndex%2==0)?a:b; } } t[i].onmouseover=function(){ if(this.x!="1")this.style.backgroundColor=c; } t[i].onmouseout=function(){ if(this.x!="1")this.style.backgroundColor=(this.sectionRowIndex%2==0)?a:b; } } } --></script> </head> <body> <table width="500" border="0" cellspacing="0" cellpadding="0" id="ejiaA1"> <tr> <td colspan="4"><span class="st1"><span><a href=http://51xuediannao.com target="_blank">懒人建站</a>收集</span> 当前页：<span>第1页 共2页 </span> 总次数：<span>66</span> 总时长：<span>284小时36分27秒</span></span></td> </tr> <tr> <th>接入方式</th><th>上网时间</th><th>下网时间</th><th>上网时长</th> </tr> <tr> <td>宽带接入</td> <td>2008-4-23 12:40:18</td> <td>2008-4-23 14:50:28</td> <td>2小时10分10秒</td> </tr> <tr> <td>宽带接入</td> <td>2008-4-23 12:40:18</td> <td>2008-4-23 14:50:28</td> <td>2小时10分10秒</td> </tr> <tr> <td>宽带接入</td> <td>2008-4-23 12:40:18</td> <td>2008-4-23 14:50:28</td> <td>2小时10分10秒</td> </tr> <tr> <td>宽带接入</td> <td>2008-4-23 12:40:18</td> <td>2008-4-23 14:50:28</td> <td>2小时10分10秒</td> </tr> <tr> <td>宽带接入</td> <td>2008-4-23 12:40:18</td> <td>2008-4-23 14:50:28</td> <td>2小时10分10秒</td> </tr> <tr> <td>宽带接入</td> <td>2008-4-23 12:40:18</td> <td>2008-4-23 14:50:28</td> <td>2小时10分10秒</td> </tr> </table> <script language="javascript"><!-- //ejiaA1("表格名称","奇数行背景","偶数行背景","鼠标经过背景","点击后背景"); ejiaA1("ejiaA1","#fff","#F5F5F5","#FFFFCC","#FFFF84"); --></script> <!--下面只是说明与程序代码无关--> <div style="width:95%; height:auto; display:block; margin:0 auto; margin-top:30px; font-size:10pt; line-height:150%;"> <span>本代码由<a href="http://www.51xuediannao.com" style="color:#F00;">懒人建站网 收集整理 我要学电脑.COM →51xuediannao.com</a> </span><br> <a href="http://www.51xuediannao.com">懒人建站 http://www.51xuediannao.com</a><br /><br/> <span>我们为您提供- <a href="http://www.51xuediannao.com/html+css/">HTML+CSS模板</a>， <a href="http://www.51xuediannao.com/js/">JS代码</a>， <a href="http://www.51xuediannao.com/JS/texiao/">网页特效</a>， <a href="http://www.51xuediannao.com/JS/nav/">导航菜单</a>， <a href="http://www.51xuediannao.com/JS/Slide/">焦点幻灯片<a>， <a href="http://www.51xuediannao.com/JS/show/">网页欣赏</a>和 <a href="http://www.51xuediannao.com/JS/jiqiao/css/">CSS技巧</a>；</span><br /> <span>懒人建站只收录实用和能提高用户体验的代码</span><br /> <span>我们只想解放出你的部分写代码时间来思考更高层次的设计，而不是要你懒惰、拼凑。</span> </div> </body> </html>
相关代码
分享到：
代码说明:
表格可以隔行换色，当鼠标划过表格行的时候表格行也会变色，当单击表格行的时候表格亦变色。
TAG标签
弹出层
jQuery
图片展示
下拉菜单
左右滚动
选项卡
二级导航
jQuery弹出层
来源：
懒人建站
|
发布人：懒人建站
|
2010-02-26
|
热度：次
|
收 藏
|
报 错
上一篇：
基于jquery弹出层插件Lee dialog1.0
下一篇：
只半透明背景不透明文字的CSS写法
相关代码
ul/LI结构的隔行换色及鼠标滑过变色
有选中隔行变色鼠标划过变色表格特效
JS实现同页面多table隔行换色
可以排序的table表格并有分页功能
具备排序功能的表格(JS+CSS+table)
JS方法隔行换色代码
当前子类
导航菜单
焦点幻灯片
广告代码
网页特效
jquery 特效
滚动代码
qq在线客服代码
选项卡代码
jquery弹出层
栏目热点
基于jQuery弹出层有9种效果
基于jQuery的弹出层
基于jQuery弹出层插件thickbox
摄影网站照片展示jquery特效(图片组展示
jQuery点击左右滚动产品图片展示代码
Jquery点击登录按钮弹出登录层
jquery弹出层插件jquery.msgbox5.0
仿wordpress 3D旋转标签云JS代码
基于jQuery的图片展示简洁版
弹出提示层背景半透明不可操作
懒人建站
相关
最新
随机
标签
相关文章
ul/LI结构的隔行换色及鼠标滑过变色
有选中隔行变色鼠标划过变色表格特效
JS实现同页面多table隔行换色
可以排序的table表格并有分页功能
具备排序功能的表格(JS+CSS+table)
JS方法隔行换色代码
最新文章
自适应宽度的html+css图片提交按钮代码
图片大小固定的html+css图片提交按钮代码
为网站增加圣诞节祝福动画百度的圣诞老人动画
日期时间带星期农历js代码特效
仿腾讯|新浪微博的文本向下滚动JS特效代码
向上逐行滚动JS代码文本特效，鼠标划过暂停
基于jQuery弹出窗口插件特效AsyncBox-v1.2.6
向左滚动的文字特效JS代码
向上滚动的文字特效JS代码
基于jQuery弹出层插件thickbox
随机推荐
只半透明背景不透明文字的CSS写法
鼠标划过搜索框弹出关键词提示层
几个输入内容框同步输入JS代码
鼠标滑过图片实现图片的局部放大JS特效代码
图片大小固定的html+css图片提交按钮代码
点击问题展开隐藏的答案JS代码
JQuery自动切换焦点图片(带文字说明)
JS实现flash效果的竖向折叠二级菜单(HTML+CSS+JS)
iframe自适应高度JS代码特效
鼠标划过显示title说明并且title属性支持html代码
热门标签
弹出层
jQuery
图片展示
下拉菜单
左右滚动
选项卡
二级导航
jQuery弹出层
HTML+CSS
弹出窗口
右下角
导航菜单
CSS技巧
点击滚动
JS代码
设计技巧
设计理论
jQuery插件
SEO
界面设计
jQuery
|
jquery特效
|
jQuery弹出层
|
JS代码
|
js特效代码大全
|
JS广告代码
|
下拉菜单代码
|
QQ客服
|
html+css
Copyright © 2008-2009
懒人建站
www.51xuediannao.com 版权所有
Powered by
懒人建站
备案号：豫ICP备09003854号
登 录
|
注 册
你也许会喜欢
X 关闭
↑返回顶部
→相关代码/文章
收藏到：
百度搜藏
新浪微博
QQ空间
更多
香港
免备案
空间，一年
80元
，500M空间、
免费送100M mysql
数据库。
香港新世界
电讯机房，与
万网
香港空间同机房，
懒人建站
同服务器。
速度演示：
jquery 特效
懒人建站
