会员
周边
众包
新闻
博问
闪存
赞助商
所有博客
当前博客
我的博客
我的园子
账号设置
简洁模式
...
退出登录
注册
登录
瞬间
瞬间永恒
博客园
首页
新随笔
联系
订阅
管理
表格隔行换色与鼠标经过变色
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Language" content="utf-8" /> <style type="text/css"><!-- #senfe { width: 300px; border-top: #000 1px solid; border-left: #000 1px solid; } #senfe td { border-right: #000 1px solid; border-bottom: #000 1px solid; } --></style> <script language="javascript"><!-- function senfe(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 border="0" cellpadding="0" cellspacing="0" id="senfe"> <tr><td> </td><td> </td><td> </td><td> </td></tr> <tr><td> </td><td> </td><td> </td><td> </td></tr> <tr><td> </td><td> </td><td> </td><td> </td></tr> <tr><td> </td><td> </td><td> </td><td> </td></tr> <tr><td> </td><td> </td><td> </td><td> </td></tr> <tr><td> </td><td> </td><td> </td><td> </td></tr> <tr><td> </td><td> </td><td> </td><td> </td></tr> <tr><td> </td><td> </td><td> </td><td> </td></tr> <tr><td> </td><td> </td><td> </td><td> </td></tr> <tr><td> </td><td> </td><td> </td><td> </td></tr> </table> <script language="javascript"><!-- //senfe("表格名稱","奇數行背景","偶數行背景","鼠標經過背景","點擊後背景"); senfe("senfe","#fff","#ccc","#cfc","#f00"); --></script> </body>
[Ctrl+A 全部選擇 提示:你可先修改部分代碼,再按運行]
<style type="text/css"><!-- #senfe { width: 650px; border-top: #E3E3E3 1px solid; border-left: #E3E3E3 1px solid; } #senfe td { padding: 5px;border-right: #E3E3E3 1px solid; border-bottom: #E3E3E3 1px solid; } #senfe2 { width: 650px; border-top: #E3E3E3 1px solid; border-left: #E3E3E3 1px solid; } #senfe2 td { padding: 5px;border-right: #E3E3E3 1px solid; border-bottom: #E3E3E3 1px solid; } --></style> <script language="javascript"><!-- function senfe(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> <P><TABLE id="senfe" cellSpacing=0 cellPadding=0 width="650px" border=0> <TR> <TD colSpan=7><H3 id=about2>電子雜誌製作價格表</H3></TD></TR> <TR> <TD width="12%">版 本</TD> <TD width="12%">簡易版</TD> <TD width="13%">普及版</TD> <TD width="13%">標準版</TD> <TD width="14%">專業版</TD> <TD width="15%">創意版</TD> <TD width="15%">經典版</TD> </TR> <TR> <TD>製作週期</TD> <TD>5天以內</TD> <TD>10天以內</TD> <TD>10天-15天</TD> <TD>30天-45天</TD> <TD>與客戶另行協商</TD> <TD>與客戶另行協商</TD> </TR> <TR> <TD colspan="7"> <p style="color:red">如果客戶長期期刊製作合作,價格將更加優惠。</p></TD> </TR> </TABLE> <TABLE id="senfe2" cellSpacing=0 cellPadding=0 width="650px" border=0> <TR> <TD colSpan=3><H3 id=about2>電子雜誌製作單項價格表</H3></TD></TR> <TR> <TD width="12%">單項項目</TD> <TD width="26%">單價</TD> <TD width="46%">備註</TD> </TR> <TR> <TD>專業配音</TD> <TD>面議</TD> <TD>專業錄音棚+專業錄音員,看配音內容多少而定</TD> </TR> <TR> <TD>專業拍攝</TD> <TD>面議</TD> <TD>專業攝影看客戶需求而定</TD> </TR> </TABLE> </P> </LI> </UL> </DIV></DIV></DIV> <script language="javascript"><!-- //senfe("表格名稱","奇數行背景","偶數行背景","鼠標經過背景","點擊後背景"); senfe("senfe","#fff","#F5F5F5","#FFFFCC","#FFFF84"); //senfe("表格名稱","奇數行背景","偶數行背景","鼠標經過背景","點擊後背景"); senfe("senfe2","#fff","#F5F5F5","#FFFFCC","#FFFF84"); --></script>
[Ctrl+A 全部選擇 提示:你可先修改部分代碼,再按運行]
posted @
2008-10-20 17:48
一瞬间
阅读(
678
) 评论(
0
)
编辑
收藏
举报
刷新页面
返回顶部
公告