`
txf2004
  • 浏览: 7064658 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

可放在网页旁边的导航菜单,点击向右边展开

阅读更多
<iframe name="google_ads_frame" marginwidth="0" marginheight="0" src="http://googleads.g.doubleclick.net/pagead/ads?client=ca-pub-4490194096475053&amp;dt=1228478659737&amp;lmt=1226285682&amp;prev_slotnames=1891601125&amp;output=html&amp;slotname=3685991503&amp;correlator=1228478659690&amp;url=http%3A%2F%2Fwww.corange.cn%2Farchives%2F2008%2F10%2F1811.html&amp;ea=0&amp;ref=http%3A%2F%2Fwww.corange.cn%2Fhtml%2Fcorange__96.html&amp;frm=0&amp;ga_vid=368793713.1228304108&amp;ga_sid=1228478083&amp;ga_hid=1765851460&amp;ga_fc=true&amp;flash=9.0.124.0&amp;u_h=768&amp;u_w=1024&amp;u_ah=715&amp;u_aw=1024&amp;u_cd=32&amp;u_tz=480&amp;u_java=true&amp;dtd=31" frameborder="0" width="300" scrolling="no" height="250" allowtransparency></iframe>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html>
<head>
<title>myYearbook</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<style>
.iefixdd { position: absolute; z-index: 10;/*any value*/ overflow: hidden;/*must have*/ /*width: 143px;/*must have*/;}
.iefixdd iframe { display:none;/*sorry for IE5*/ display/**/:block;/*sorry for IE5*/ position:absolute;/*must have*/ top:0;/*must have*/ left:0;/*must have*/ z-index:-1;/*must have*/ filter:mask();/*must have*/ width:300px;/*must have for any big value*/ height:300px/*must have for any big value*/; }

body { margin:0px; font-family:Tahoma, Verdana; font-size:11px; color:#202020; text-align: center; background-color:#fff; }
.sidenavitem { display:block; width:120px; padding:7px 10px; border-bottom:1px solid #d0d0d0; background-color:#FFF; color:#202020; font-weight:bold; text-decoration:none; }
.sidenavitem:hover { border-bottom:1px solid #e4eeff; background-color:#e4eeff; color:#036; }
.sidenavitem a { padding:7px 10px; color:#202020; font-weight:bold; text-decoration:none; }
.sidenavactive a { padding:7px 10px; color:#036; font-weight:bold; }
</style>

</head>
<body>
<img src="http://assets.myyearbook.com/tab_mystuff2.gif" width="17" height="104" alt="My Stuff" style="position:absolute;margin-left:-16px;cursor: pointer;clip:rect(0px,16px,104px,0px);" onclick="if(document.getElementById('mystuff').style.display==''){this.src='http://assets.myyearbook.com/tab_mystuff2.gif';document.getElementById('mystuff').style.display='none';}else{this.src='http://assets.myyearbook.com/tab_mystuff.gif';document.getElementById('mystuff').style.display='';}">
<div class="iefixdd">
<div id="mystuff" style="position:relative;border:1px solid #69C;z-index:11;display:none;">
<a href="/?mysession=cmVnaXN0cmF0aW9uX2VkaXRwcm9maWxlX2Jhc2lj" class="sidenavitem" onmouseout="if(window.leaveSideNav)leaveSideNav(this,event);">Edit Profile</a>
<a href="/?mysession=cmVnaXN0cmF0aW9uX215ZnJpZW5kcw==" class="sidenavitem" onmouseout="if(window.leaveSideNav)leaveSideNav(this,event);">My Friends</a>
<a href="/?mysession=cmVnaXN0cmF0aW9uX3JlZ19oaWdoc2Nob29sX2VkaXQmdXNlcmlkPTM1OTgwMDY=" class="sidenavitem" onmouseout="if(window.leaveSideNav)leaveSideNav(this,event);">My Yearbooks</a>
<a href="/?mysession=cmVnaXN0cmF0aW9uX3doYXRldmVyaXdhbnQ=" class="sidenavitem" onmouseout="if(window.leaveSideNav)leaveSideNav(this,event);">Whatever I Want</a>
<a href="/?mysession=bHVuY2htb25leV9teXNvY2s=" class="sidenavitem" onmouseout="if(window.leaveSideNav)leaveSideNav(this,event);">My Lunch Money</a>
<a href="/?mysession=cmVnaXN0cmF0aW9uX215cGljdHVyZXM=" class="sidenavitem" onmouseout="if(window.leaveSideNav)leaveSideNav(this,event);">My Pictures</a>
<a href="/?mysession=bGlzdGluZ192aWV3X2F1dG9ncmFwaHM=" class="sidenavitem" onmouseout="if(window.leaveSideNav)leaveSideNav(this,event);">My Autographs</a>
<a href="/?mysession=dmlkZW9fdXNlcg==" class="sidenavitem" onmouseout="if(window.leaveSideNav)leaveSideNav(this,event);">My Videos</a>
<a href="/?mysession=bGlzdGluZ19teWJhdHRsZWxpc3Q=" class="sidenavitem" onmouseout="if(window.leaveSideNav)leaveSideNav(this,event);">My Battles</a>
<a href="/?mysession=YmFja3BhY2tfYmFja3BhY2tfYWRkZmlsZV90b3A=" class="sidenavitem" onmouseout="if(window.leaveSideNav)leaveSideNav(this,event);">My Playlist</a>
<a href="/?mysession=YmFja3BhY2tfYmFja3BhY2tfdmlld191c2VyYmFja3BhY2smdXNlcmlkPTM1OTgwMDYmc29ydG9uPWJwa191cGxvYWRkYXRlJnNvcnRpbj1ERVND" class="sidenavitem" onmouseout="if(window.leaveSideNav)leaveSideNav(this,event);">My Locker</a>
<a href="/?mysession=YmxvZ3NfYmxvZw==" class="sidenavitem" onmouseout="if(window.leaveSideNav)leaveSideNav(this,event);">My Blog</a>
</div>
</div>
</body>
</html>

http://www.corange.cn//uploadfiles/1002-4_29132.jpg
分享到:
评论

相关推荐

    js导航菜单左侧竖纵向二级导航菜单可点击展开与收缩子菜单

    "js导航菜单左侧竖纵向二级导航菜单可点击展开与收缩子菜单"是一个专门针对这种交互需求设计的功能。这个功能通常应用于那些层次结构较深、内容较多的网站,使用户能够更加方便地探索和定位信息。 在实现这样的导航...

    可点击展开与收缩的左侧纵向二级导航菜单

    在IT行业中,构建一个可点击展开与收缩的左侧纵向二级导航菜单是常见的需求,尤其在网页设计和前端开发中。这种菜单设计能够有效地组织和展示网站的层级结构,提高用户体验,便于用户快速找到所需信息。下面我们将...

    jquery垂直导航菜单制作网页左侧点击展开收缩垂直菜单代码

    jquery垂直导航菜单制作网页左侧点击展开收缩垂直菜单代码 jquery垂直导航菜单制作网页左侧点击展开收缩垂直菜单代码 jquery垂直导航菜单制作网页左侧点击展开收缩垂直菜单代码 jquery垂直导航菜单制作网页左侧点击...

    竖向二级折叠导航菜单(只展开一个)

    竖向导航菜单是指菜单项沿着页面的垂直方向排列,这种布局方式在空间有限的屏幕,如手机或平板电脑上特别常见。而“二级”则意味着菜单不仅有一级菜单项,还有在一级菜单下展开的二级子菜单项。这种结构使得复杂的...

    网页顶部导航菜单

    网页顶部导航菜单,简易CSS样式,宽度,高度可自行调整。

    三级导航菜单,三级竖向展开/收缩导航菜单

    三级导航菜单,三级竖向展开/收缩导航菜单 三级导航菜单,三级竖向展开/收缩导航菜单

    懒人原生纯css向右展开多级导航菜单代码

    在网页设计中,导航菜单是不可或缺的部分,它帮助用户快速浏览和访问网站的不同部分。本文将深入探讨如何使用原生CSS实现一个向右展开的多级导航菜单,这对于那些希望在不依赖JavaScript的情况下创建交互式菜单的...

    jquery右侧边固定层导航菜单依次动画滑动显示菜单展开

    在网页设计中,导航菜单是用户与网站交互的重要组成部分,它帮助用户轻松地找到所需的信息。本主题聚焦于使用jQuery实现一种特殊的导航菜单——“右侧边固定层导航菜单依次动画滑动显示菜单展开”。这种菜单设计能...

    JS+HTML网页竖型缓冲展开菜单效果

    "JS+HTML网页竖型缓冲展开菜单效果"就是一种常见的交互设计技术,它使得用户在点击菜单时,子菜单能够平滑地以缓冲动画的方式展开或关闭,类似于QQ好友列表的展开效果。这种效果既美观又实用,能为用户提供更加流畅...

    jQuery竖直图标菜单点击展开收缩导航菜单代码

    综上所述,"jQuery竖直图标菜单点击展开收缩导航菜单代码"是一个集成了jQuery选择器、事件处理、动画效果和响应式设计的实用功能,适用于各种需要动态菜单的网页。通过学习和应用这样的代码,开发者可以提升网站的...

    js树形导航菜单制作点击展开收缩二级菜单

    在JavaScript编程中,树形导航菜单是一种常见的网页交互元素,尤其在网站的侧边栏、内容目录或文件管理系统中广泛使用。它通过层级结构展示数据,允许用户通过点击展开或收缩节点来查看或隐藏子菜单。本文将深入探讨...

    html5手机端动画展开收缩导航菜单特效

    在这个特效中,SVG图标可能是导航菜单的触发元素,当用户点击这些图标时,将启动展开或收缩动画。SVG的优势在于其图形质量不会因放大而失真,同时文件大小相对较小,适合移动端的性能需求。 CSS3是层叠样式表的最新...

    c#导航弹性收缩展开菜单

    "c#导航弹性收缩展开菜单"是一个项目,旨在创建一个具有动态效果的PC端导航菜单,它使用JavaScript (js) 和jQuery (jq) 进行前端实现,以提供用户友好的交互体验。 在C#中,虽然主要处理后端逻辑,但也可以通过ASP...

    jquerysliderToggle函数滑动竖直导航菜单点击导航展开下拉

    jquerysliderToggle函数滑动竖直导航菜单点击导航展开下拉

    十个经典的导航菜单

    在网页设计中,导航菜单是不可或缺的元素,它引导用户浏览网站各个部分,提供便捷的交互体验。"十个经典的导航菜单"集合了十款利用div+css技术构建的优秀导航布局,这些菜单设计独特,功能实用,对于网页设计师和...

    js+css3网页右侧边收缩展开导航菜单代码.zip

    《JS + CSS3 实现网页右侧边收缩展开导航菜单详解》 在网页设计中,交互性和用户体验至关重要。其中,导航菜单作为用户与网站交互的重要媒介,其设计与实现方式多种多样。今天我们将深入探讨如何利用JavaScript...

    网页常用各种导航菜单

    网页中的导航菜单是用户体验设计的重要组成部分,它帮助用户在网站中快速定位并浏览各个页面。在当前的网页设计中,有几种常见的导航菜单类型,包括横向导航、抽屉菜单和多级下拉菜单,这些菜单通常会结合JavaScript...

    html5手机端动画展开收缩导航菜单特效.zip

    HTML5手机端动画展开收缩导航菜单特效是一种常见且重要的网页设计技术,特别是在移动设备上,它为用户提供了直观且互动的界面体验。这个压缩包文件包含了一套基于jQuery实现的解决方案,适合那些对网页交互性有高...

    jquery垂直导航菜单展开收缩垂直二级导航菜单代码

    在网页设计中,导航菜单是不可或缺的部分,它帮助用户快速浏览和访问网站的不同部分。`jQuery` 是一个广泛使用的 JavaScript 库,它简化了DOM操作、事件处理和动画效果等任务,因此在创建动态导航菜单时,jQuery ...

    js实现点击向下展开的下拉菜单效果代码

    从给定的文件中,我们可以提取到关于使用纯JavaScript实现点击向下展开的下拉菜单的相关知识点。下面将对这些知识进行详细阐述: 1. HTML结构设计:文档中给出了一个具有下拉菜单功能的HTML结构,它包含了一个带有...

Global site tag (gtag.js) - Google Analytics