一個(gè)很簡單的辦法實(shí)現(xiàn)TD的加亮效果.
更新時(shí)間：2006年09月07日 00:00:00 作者：
復(fù)制代碼 代碼如下:
function Menu_Init(obj){
var tds = obj.getElementsByTagName("td");
for (var i = 0; i < tds.length; i++)
{
if (tds[i].className == "MenuOptions")
{
tds[i].onmouseover = switch_bg;
tds[i].onmouseout = switch_bg;
}
}
}
function switch_bg(e){
if (this.className=="MenuOptions_click") return
this.className = (this.className == "MenuOptions") ? "MenuOptions_hilite" : "MenuOptions";
}
var tds = obj.getElementsByTagName("td");
for (var i = 0; i < tds.length; i++)
{
if (tds[i].className == "MenuOptions")
{
tds[i].onmouseover = switch_bg;
tds[i].onmouseout = switch_bg;
}
}
}
function switch_bg(e){
if (this.className=="MenuOptions_click") return
this.className = (this.className == "MenuOptions") ? "MenuOptions_hilite" : "MenuOptions";
}
Menu_Init(obj)用于初始化 Table.
所需要的CSS
復(fù)制代碼 代碼如下:
.MenuOptions{
padding:2px;
cursor:hand;
color:#000000;
}
.MenuOptions_hilite{
padding:1px;
border:outset 1px #669999;
cursor:hand;
color:#000000;
}
padding:2px;
cursor:hand;
color:#000000;
}
.MenuOptions_hilite{
padding:1px;
border:outset 1px #669999;
cursor:hand;
color:#000000;
}
table示范
復(fù)制代碼 代碼如下:
<table id=MenuTools border="0" cellspacing="2" style="border:1px solid #000000;color:#000000;font-size:12px">
<tr>
<td class="MenuOptions" >大家好呀
<td class="MenuOptions" >很容易實(shí)現(xiàn)的效果
<td class="MenuOptions" >喜歡的就拿去用吧
<td >這個(gè)不允許加亮
</tr>
</table>
<tr>
<td class="MenuOptions" >大家好呀
<td class="MenuOptions" >很容易實(shí)現(xiàn)的效果
<td class="MenuOptions" >喜歡的就拿去用吧
<td >這個(gè)不允許加亮
</tr>
</table>
演示
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
相關(guān)文章
公司最近一個(gè)項(xiàng)目中，出現(xiàn)了一個(gè)非window主題外觀的下拉菜單，于是自己搞了個(gè)。2008-11-11
二級(jí)連動(dòng)菜單...2006-07-07
這篇文章主要介紹了Css3制作變形與動(dòng)畫效果，css3制作動(dòng)畫主要用到：變形(transform)，過渡(transition)和動(dòng)畫(animation)三個(gè)屬性,需要的朋友可以參考下2015-07-07
表單內(nèi)同名元素的控制...2006-11-11
下面的代碼是對一些表單經(jīng)常需要驗(yàn)證的一些函數(shù)，方便大家使用。2010-11-11
javascript各瀏覽器中option元素的表現(xiàn)差異
javascript各瀏覽器中option元素的表現(xiàn)差異,需要的朋友可以參考下。2011-04-04
按鈕里的字可以換行嗎...2006-10-10
Javascript 表單之間的數(shù)據(jù)傳遞代碼
今天有朋友問我關(guān)于用JAVASCRIPT來進(jìn)行頁面各表單之間的數(shù)據(jù)傳遞的問題，我以前也寫過，不過從來沒有注意，今天總結(jié)了一下，希望能夠給大家一些幫助，也幫助我總結(jié)以前學(xué)過，用過的知識(shí)。2008-12-12
通過隱藏option實(shí)現(xiàn)select的聯(lián)動(dòng)效果
開始的時(shí)候需求是根據(jù)一定條件隱藏一部分<option>標(biāo)簽，類似聯(lián)動(dòng)效果，但是目前的html規(guī)范并沒有為<option>提供隱藏的效果，因此常用的設(shè)置display或者visibility無效。2009-11-11
input 文本框內(nèi)容改變，我們可以使用onchange或者onblur來進(jìn)行判斷，但是onchange是在文本內(nèi)容改變，然后失去焦點(diǎn)的時(shí)候發(fā)生，onblur是在失去焦點(diǎn)時(shí)候發(fā)生，不會(huì)自己去判斷。2010-04-04