耽恋免费资源站 介绍各种免费资源信息，提供各类免费资源下载.

当前位置 :| 首页>网页特效代码>菜单导航特效>

会动的菜单 - 网页特效代码演示

Wt:耽恋网页特效教程耽恋免费资源站 Dt:2008-06-14

要完成此效果把如下代码加入到<body>区域中

<style type="text/css">

</style>
<script language="JavaScript">

</script><p><div id="Layer1" style="position:absolute; width:200px; height:115px; z-index:1">
  <div id="Layer2" style="position:absolute; left:666px; top:59px; width:67px; height:52px; z-index:2; background-color: #0068FF; layer-background-color: #0068FF; border: 1px none #000000; visibility: visible" class="t"> 
    <table width="100%" border="0" cellspacing="0" cellpadding="0" height="100%">
      <tr> 
        <td align="center" valign="top"><font color="#FFFFFF" onMouseOver="P7AniMagic('Layer2',611,35,5,30,0,0)" onMouseOut="P7AniMagic('Layer2',666,59,5,30,0,0)">on 
          1<br>
          <a href="#">第一項</a><br>
          <a href="#">第二項</a><br>
          <a href="#">第三項</a><br>
          </font></td>
      </tr>
    </table>
  </div>
  <div id="Layer3" style="position:absolute; left:666px; top:81px; width:66px; height:84px; z-index:3; background-color: #0066FF; layer-background-color: #0066FF; border: 1px none #000000; visibility: visible" class="t"> 
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
      <tr> 
        <td>
          <div align="center"><font color="#FFFFFF" onMouseOver="P7AniMagic('Layer3',611,55,5,30,0,0)" onMouseOut="P7AniMagic('Layer3',666,81,5,30,0,0)">on 2<br>
            <a href="#">第一項</a><br>
            <a href="#">第二項</a><br>
            <a href="#">第三項</a><br>
            </font></div>
        </td>
      </tr>
    </table>
  </div>
  <div id="Layer4" style="position:absolute; width:68px; height:80px; z-index:4; left: 666px; top: 102px; background-color: #0064FF; layer-background-color: #0064FF; border: 1px none #000000; visibility: visible" class="t"> 
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
      <tr> 
        <td>
          <div align="center"><font color="#FFFFFF" onMouseOver="P7AniMagic('Layer4',611,75,5,30,0,0)" onMouseOut="P7AniMagic('Layer4',666,102,5,30,0,0)">on 3<br>
            <a href="#">第一項</a><br>
            <a href="#">第二項</a><br>
            <a href="#">第三項</a><br>
            </font></div>
        </td>
      </tr>
    </table>
  </div>  <div id="Layer5" style="position:absolute; width:65px; height:127px; z-index:5; left: 265px; top: 56px"> 
    <table width="100%" border="0" cellspacing="0" cellpadding="0" height="72">
      <tr> 
        <td height="24" onMouseOver="P7AniMagic('Layer2',611,35,5,30,0,0)" onMouseOut="P7AniMagic('Layer2',666,59,5,30,0,0)">    </td>
      </tr>
      <tr>
        <td height="24" onMouseOver="P7AniMagic('Layer3',611,55,5,30,0,0)" onMouseOut="P7AniMagic('Layer3',666,81,5,30,0,0)">    </td>
      </tr>
      <tr>
        <td height="24" onMouseOver="P7AniMagic('Layer4',611,75,5,30,0,0)" onMouseOut="P7AniMagic('Layer4',666,102,5,30,0,0)">    </td>
      </tr>
    </table>
  </div>
</div>

[收藏] [推荐] [评论] [打印] [关闭] []

上一篇：可与IE整合、分离的导航条 - 网页特效代码演示
下一篇：非常酷的图形渐隐导航菜单栏 - 网页特效代码演示

相关文章：

半透明的下拉菜单特效 - 网页特

可选择左右滚动的菜单,带缓动效

一种标准的网页下拉菜单(符合web

最新google首页的超酷导航效果 -

一个多功能蓝色漂亮的搜索条. -

滑动门技术菜单 - 兼容firefox火

XP菜单网页特效 - 网页特效代码

显示隐藏的导航菜单 - 网页特效

多颜色菜单 - 网页特效代码演示

windows XP左侧的菜单效果 - 网

最新评论

查看所有评论

精彩推荐

栏目列表

推荐浏览

热点关注

手机图片

关于本站-免责声明-联系我们-广告联系-帮助中心
Copyright @ 2008 耽恋免费资源网站★www.DLcom.org All rights reserved.