|
效果：
運(yùn)行代碼框
[Ctrl+A 全部選擇 提示：你可先修改部分代碼，再按運(yùn)行]
已經(jīng)封裝成 js 文件的代碼：
// JavaScript Document
function preset()
{
document.getElementById("itemlist").childNodes[selectindex].firstChild.firstChild.className="style1";
document.getElementById("itemlist").childNodes[selectindex+1].childNodes[0].childNodes[0].className="style2";
innersubclass();
}
function focusthis(obj)
{
clearselect();
obj.className = "style1";
obj.parentNode.parentNode.nextSibling.firstChild.firstChild.
className="style2";
innersubclass(obj);
}
function innersubclass(obj)
{
if (obj==null)
{
document.getElementById("subclass").innerHTML = subclass[selectindex];
}else
{
for(i=0; i<obj.parentNode.parentNode.parentNode.childNodes.length;i++)
{
if(obj == document.getElementById("itemlist").childNodes[i].firstChild.firstChild)
{
document.getElementById("subclass").innerHTML = subclass[i];
}
}
}
}
function recover()
{
clearselect();
preset();
innersubclass();
}
function clearselect()
{
for (i=0; i<document.getElementById("itemlist").childNodes.length; i++)
{
document.getElementById("itemlist").childNodes[i].firstChild.firstChild.className="style0";
}
}
在代碼編寫過程中，發(fā)現(xiàn) Firefox 對 DOM 解釋和 IE 對 DOM 的解釋差別較大。雖然上面的代碼也兼容ff，但實(shí)現(xiàn)的方法不太標(biāo)準(zhǔn)，近期需要補(bǔ)習(xí)一下 FF 下的DOM。
目前此效果僅能應(yīng)用于網(wǎng)站導(dǎo)航條，如果要做成斜體的選項(xiàng)卡效果，還需要調(diào)整一下代碼，但估計(jì)不用重寫了，呵呵
經(jīng)典論壇討論帖：
http://www.95time.cn/bbs/NewsDetail.asp?id=2614732
出處：藍(lán)色理想
責(zé)任編輯：moby
◎進(jìn)入論壇網(wǎng)站綜合、網(wǎng)頁制作版塊參加討論
|
