国产毛片午夜福利,国产黄网,国产亚洲天堂,97国产精品

  •  
    DHTML模擬菜單
    發(fā)布時(shí)間:2005-03-31   瀏覽次數(shù):1186287
    { 在以前的HTML里,元素的位置只能依次排列,我們很難地定位與控制網(wǎng)頁(yè)中的一些元素。CSS2Cascading Style Sheet Level 2,層疊樣式單第二版的布局Layout屬性出現(xiàn)并得到瀏覽器的廣泛支持之后,我們不僅可以靜態(tài)地實(shí)現(xiàn)以上目的,而且可以根據(jù)鼠標(biāo)、鍵盤(pán)、時(shí)間等預(yù)定義好的外界事件動(dòng)態(tài)地改變布局。時(shí)下非常流行的網(wǎng)頁(yè)中“活動(dòng)的層”便是它的一種形象的運(yùn)用,我們這里要講的是如何運(yùn)用這些屬性結(jié)合一些DHTML對(duì)象在網(wǎng)頁(yè)中實(shí)現(xiàn)類(lèi)似Windows窗口的下拉菜單(如圖所示)。請(qǐng)看以下代碼及詳細(xì)說(shuō)明。 <-- 以下部分應(yīng)該插在代碼的<head>之后 --> <style><-- / 這是一些CSS樣式。其中″btnTD″是按鈕在被按下之前“凸起”的樣式類(lèi):邊框被設(shè)置為寬度為1個(gè)像素的實(shí)線,其中左邊框和上邊框顏色為淺色(這里為白色),右下邊框?yàn)樯钌ㄉ罨疑绻尘盀榛疑模龋裕停淘兀ㄈ鐔卧瘢┦褂眠@個(gè)樣式的話,那非常像一個(gè)“凸出”的按鈕;“btnDTD”是按鈕被按下時(shí)“凹下”的樣式。 / .btnTD  border-left 1 solid #ffffff border-right 1 solid #808080 border-top 1 solid #ffffff border-bottom 1 solid #808080  .btnDTD  border-left 1 solid #808080 border-right 1 solid #ffffff border-top 1 solid #808080 border-bottom 1 solid #ffffff  td  font-family 宋體 font-size 9pt  --></style> <script language=″JavaScript″><-- //判斷哪個(gè)按鈕被按下的全局變量 var intBlnClk=0 //鼠標(biāo)經(jīng)過(guò)、離開(kāi)、點(diǎn)擊更改單元格CSS樣式的函數(shù) function mOvrOutobjSrc var argvargcblnActivestrColorstrBgColorstrClassstrClassDstrCursor argv=mOvrOut.argumentsargc=argv.length /默認(rèn)情況下不將當(dāng)前對(duì)象置為“”/ blnActive=argc>1﹖evalargv[1]false /默認(rèn)鼠標(biāo)經(jīng)過(guò)當(dāng)前對(duì)象的樣式為“凸出的按鈕形”/ strClass=argc>2 && argv[2]=′′﹖argv[2]′btnTD′ /默認(rèn)鼠標(biāo)點(diǎn)擊的時(shí)候當(dāng)前對(duì)象為“凹下的按鈕形”/ strClassD=argc>3 && argv[3]=′′﹖argv[3]′btnDTD′ /將當(dāng)前對(duì)象時(shí)候的前景色為白色、背景色為藍(lán)色、鼠標(biāo)樣式為手形/ strColor=′#ffffff′strBgColor=′#000080′strCursor=′hand′ /IE4及其更高版本才支持這些JavaScript對(duì)CSS樣式的動(dòng)態(tài)改變/ ifdocument.all //將當(dāng)前對(duì)象的鼠標(biāo)樣式置為參數(shù)傳遞值 objSrc.style.cursor=strCursor //如果是鼠標(biāo)進(jìn)入當(dāng)前對(duì)象范圍 ifobjSrc.containsevent.fromElement /設(shè)置為活動(dòng)樣式/ ifblnActive objSrc.bgColor=strBgColorobjSrc.style.color=strColor  /當(dāng)前對(duì)象不需要置為活動(dòng)樣式的時(shí)候,如果本來(lái)的樣式是“凸出的按鈕形”則置為“凹下的按鈕形”,反之亦然/ else objSrc.className=intBlnClk=0﹖strClassDstrClass  //鼠標(biāo)離開(kāi)當(dāng)前對(duì)象區(qū)域 else ifobjSrc.containsevent.toElement //將這些樣式置為默認(rèn)值 objSrc.bgColor=′′objSrc.style.color=′′objSrc.className=′′   / 顯示/隱藏層的通用函數(shù)。用objNS、objIE、strStu作為參數(shù),其中objNS和objIE分別是Netscape和IE的“層”對(duì)象,strStu為層的狀態(tài)。因?yàn)槠,?qǐng)查看本文尾部說(shuō)明。 / function shoHidLayers / 調(diào)用上面的函數(shù),顯示/隱藏參數(shù)傳遞的層,這樣是為了簡(jiǎn)化代碼。這里不給出詳細(xì)函數(shù)。/ function showLayerintCurrent //--></script></head> <body onMouseDown=″ifwindow.event.srcElement.style.color==′′ showLayer1′hide′″> <-- 以上body部分的作用是當(dāng)鼠標(biāo)沒(méi)有按下任何按鈕的時(shí)候隱藏所有應(yīng)該隱藏的“菜單”。以下是兩個(gè)用CSS布局定義的層,名為“menu”的層的初始狀態(tài)為:在屏幕上的位置為(1212),可視,層z-index屬性為100;“menu1”為不可視。 --> <div id=″menu″ style=″positionabsolutevisibility visibleleft12pxtop12px z-index 100″><table border=″1″ cellspacing=″0″ cellpadding=″2″ bgcolor=″#c0c0c0″ bordercolor=″#c0c0c0″> <tr><td onMouseOver=″mOvrOutthis″ onMouseOut=″mOvrOutthis″ onClick=″mOvrOutthisfalse′btnDTD′showLayer1″>天極網(wǎng)</td></tr> </table></div> <div id=″menu1″ style=″positionabsolutevisibility hiddenleft11pxtop34px z-index 1″><table border=″0″ cellpadding=″2″ cellspacing=″0″ bgcolor=″#c0c0c0″ class=″btnTD″> <tr><td onMouseOver=″mOvrOutthistrue″ onMouseOut=″mOvrOutthis″ width=″100%″nowrap onClick=″window.location=′http//www.pcwclub.com/′showLayer1′hide′″>電腦報(bào)讀者俱樂(lè)部</td></tr> </table></div> 因?yàn)槠,一些函?shù)不能詳細(xì)給出及說(shuō)明,如果需要完整代碼請(qǐng)?jiān)L問(wèn)以下鏈接:http//ctsight.topcool.net/documents/menu.html。
    立即預(yù)約