欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

js實(shí)現(xiàn)的早期滑動(dòng)門(mén)菜單效果代碼

 更新時(shí)間:2015年08月27日 10:53:03   作者:企鵝  
這篇文章主要介紹了js實(shí)現(xiàn)的早期滑動(dòng)門(mén)菜單效果代碼,涉及javascript數(shù)組遍歷及通過(guò)鼠標(biāo)事件動(dòng)態(tài)改變頁(yè)面元素屬性的技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下

本文實(shí)例講述了js實(shí)現(xiàn)的早期滑動(dòng)門(mén)菜單效果代碼。分享給大家供大家參考。具體如下:

這里介紹的是傳說(shuō)中的早期滑動(dòng)門(mén)菜單Demo代碼,測(cè)試時(shí)請(qǐng)把鼠標(biāo)放到左側(cè)相應(yīng)的導(dǎo)航欄目上,放在左側(cè)菜單上的時(shí)候,你就發(fā)現(xiàn)玄機(jī)了,右側(cè)的內(nèi)容會(huì)跟著變化,JS與HTML結(jié)合實(shí)現(xiàn)的,比較傳統(tǒng)的導(dǎo)航效果。

運(yùn)行效果截圖如下:

在線演示地址如下:

http://demo.jb51.net/js/2015/js-old-ver-menu-cha-codes/

具體代碼如下:

<HTML>
<HEAD>
<TITLE>文字導(dǎo)航效果--滑動(dòng)門(mén)</TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
</HEAD>
<BODY bgColor=#fef4d9>
<CENTER>
<TABLE borderColor=#993399 border=5 borderlight="green">
 <TBODY>
 <TR>
 <TD align=middle>
  <SCRIPT language=JavaScript>
<!-- Begin
var linktext=new Array()
linktext[0]='<table border="0" width="210" height="185" bgcolor="#EFEFEF" cellpadding="8" cellspacing="0"><tr><td valign="top">國(guó)內(nèi)最常用的校友錄站點(diǎn)</td></tr></table>'
linktext[1]='<table border="0" width="210" height="185" bgcolor="#D1FD80" cellpadding="8" cellspacing="0"><tr><td valign="top">國(guó)內(nèi)最大的游戲網(wǎng)站-第九城市</td></tr></table>'
linktext[2]='<table border="0" width="210" height="185" bgcolor="#FDB9FD" cellpadding="8" cellspacing="0"><tr><td valign="top">國(guó)內(nèi)最大的新聞發(fā)布類(lèi)站點(diǎn)-新浪網(wǎng)</td></tr></table>'
linktext[3]='<table border="0" width="210" height="185" bgcolor="#FFFF5E" cellpadding="8" cellspacing="0"><tr><td valign="top">國(guó)內(nèi)最大的綜合性?shī)蕵?lè)站點(diǎn)--網(wǎng)易</td></tr></table>'
linktext[4]='<table border="0" width="210" height="185" bgcolor="#C2D7FC" cellpadding="8" cellspacing="0"><tr><td valign="top">最大的搜索引擎站點(diǎn)...百度</td></tr></table>'
var ns6=document.getElementById&&!document.all
var ie=document.all
function show_text(thetext, whichdiv){
if (ie) eval("document.all."+whichdiv).innerHTML=linktext[thetext]
else if (ns6) document.getElementById(whichdiv).innerHTML=linktext[thetext] }
function reset(whichdiv){
if (ie) eval("document.all."+whichdiv).innerHTML='<table border="0" width="210" height="185" bgcolor="#F88530" cellpadding="0" cellspacing="8"><tr><td valign="top"><font face="arial" size="4"><b>請(qǐng)把鼠標(biāo)放到左側(cè)相應(yīng)的導(dǎo)航欄目上<p>有所變化</b></font></td></tr></table>'
else if (ns6) document.getElementById(whichdiv).innerHTML='<table border="0" width="210" height="185" bgcolor="#F88530" cellpadding="8" cellspacing="0"><tr><td valign="top"><font face="arial" size="4"><b>請(qǐng)把鼠標(biāo)放到左側(cè)相應(yīng)的導(dǎo)航欄目上<p>看到變化效果了嗎?</b></font></td></tr></table>'}
// End -->
</SCRIPT>
  <TABLE cellSpacing=0 cellPadding=3 width=370 align=center bgColor=black 
  border=0>
  <TBODY>
  <TR>
   <TD>
   <TABLE cellSpacing=0 cellPadding=0 width=370 background="" 
    border=0><TBODY>
    <TR>
    <TD>
     <TABLE cellSpacing=0 cellPadding=8 width=160 bgColor=#f88530 
     border=0>
     <TBODY>
     <TR>
      <TD onMouseOver="bgColor='#EFEFEF'; show_text(0,'div1')" 
      style="CURSOR: hand" 
      onclick="window.location='http://www.chinaren.com'" 
      onmouseout="bgColor='#F88530'; reset('div1')">中國(guó)人</TD></TR>
     <TR>
      <TD onMouseOver="bgColor='#D1FD80'; show_text(1,'div1')" 
      style="CURSOR: hand" 
      onclick="window.location='http://www.the9.com'" 
      onmouseout="bgColor='#F88530'; reset('div1')">第九城市</TD></TR>
     <TR>
      <TD onMouseOver="bgColor='#FDB9FD'; show_text(2,'div1')" 
      style="CURSOR: hand" 
      onclick="window.location='http://www.sina.com.cn'" 
      onmouseout="bgColor='#F88530'; reset('div1')">新浪網(wǎng)</TD></TR>
     <TR>
      <TD onMouseOver="bgColor='#FFFF5E'; show_text(3,'div1')" 
      style="CURSOR: hand" 
      onclick="window.location='http://www.163.com'" 
      onmouseout="bgColor='#F88530'; reset('div1')">網(wǎng)易</TD></TR>
     <TR>
      <TD onMouseOver="bgColor='#C2D7FC'; show_text(4,'div1')" 
      style="CURSOR: hand" 
      onclick="window.location='http://www.baidu.com'" 
      onmouseout="bgColor='#F88530'; reset('div1')">百度一下</TD></TR></TBODY></TABLE></TD>
    <TD><SPAN id=div1>
     <TABLE height=185 cellSpacing=0 cellPadding=8 width=210 
     bgColor=#f88530 border=0>
     <TBODY>
     <TR>
      <TD vAlign=top><FONT face=arial 
      size=4><B>請(qǐng)把鼠標(biāo)放到左側(cè)相應(yīng)的導(dǎo)航欄目上
 <P>有所變化</P></B></FONT></TD></TR></TBODY></TABLE></SPAN></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>
</CENTER>
</BODY>
</HTML>

希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。

相關(guān)文章

最新評(píng)論