javascript 弹性菜单，垂直的那种

更新时间：2008年12月30日 00:06:33 作者：

javascript 垂直弹性菜单

<html> <head> <style type="text/css"> body {cursor:hand; margin:0; padding:0; position:absolute; overflow:hidden; left:0; top:0; width:100%; height:100%;} .link {position:absolute;left:0;width:100%;height:0;background:#000;overflow:hidden;visibility:hidden;} .title {position:relative;cursor:pointer;background:#FF6600;width:100%;color:#fff;font-family:trebuchet MS;verdana;font-size:11px;left:2;height:15;overflow:hidden;} .title_o {position:relative;cursor:pointer;background:#fff;width:100%;color:#000;font-family:trebuchet MS;verdana;font-size:11px;left:2;height:15;overflow:hidden;} .text {position:relative;text-align:justify;margin:10px;font-family:trebuchet MS;verdana;font-size:11px;color:#FFF;overflow:hidden;height:90%} .fernando { font-family: "Trebuchet MS", Geneva, Arial, Helvetica, san-serif; font-size: 16px; font-weight: bolder} .mafra { } </style> <script type="text/javascript"> </script> </head> <body bgcolor="#333333"> <div style="position:absolute;left:50%;top:50%"> <div id="frames" style="position:absolute;width:200;height:340;left:-100;top:-180;overflow:hidden"> <span class="link"> <div class="title"></div> <div style="position:relative;text-align:center;margin:0px;font-family:trebuchet MS; verdana;font-size:29px;font-weight:bold;color:#FFF;overflow:hidden;height:120%"> <a href="http://www.mafra.fot.br/photos/alimentos.htm" target="_self" onFocus="if(this.blur)this.blur()"><img src="http://www.mafra.fot.br/photos/images/img_logo_home.gif" width="191" height="189" border="0"></a> </div> </span> <span class="link"> <div class="title"><b> alimentos /<i> food</i></b></div> <div class="text"> <a href="http://www.mafra.fot.br/photos/alimentos.htm" target="_self" onFocus="if(this.blur)this.blur()"><img src="http://www.mafra.fot.br/photos/images/img_home-01.jpg" width="183" height="174" border="0"></a> </div> </span> <span class="link"> <div class="title"><b> bebidas /<i> drinks</i></b></div> <div class="text"> <a href="http://www.mafra.fot.br/photos/bebidas.htm" target="_self" onFocus="if(this.blur)this.blur()"><img src="http://www.mafra.fot.br/photos/images/img_home-02.jpg" width="183" height="174" border="0"></a> </div> </span> <span class="link"> <div class="title"><b> joias /<i> jewels</i></b></div> <div class="text"> <a href="http://www.mafra.fot.br/photos/joias.htm" target="_self" onFocus="if(this.blur)this.blur()"><img src="http://www.mafra.fot.br/photos/images/img_home-03.jpg" width="183" height="174" border="0"></a> </div> </span> <span class="link"> <div class="title"><b> natureza /<i> nature</i></b></div> <div class="text"> <a href="http://www.mafra.fot.br/photos/natureza.htm" target="_self" onFocus="if(this.blur)this.blur()"><img src="http://www.mafra.fot.br/photos/images/img_home-04.jpg" width="183" height="174" border="0"></a> </div> </span> <span class="link"> <div class="title"><b> gente /<i> people</i></b></div> <div class="text"> <a href="http://www.mafra.fot.br/photos/pessoas.htm" target="_self" onFocus="if(this.blur)this.blur()"><img src="http://www.mafra.fot.br/photos/images/img_home-05.jpg" width="183" height="174" border="0"></a> </div> </span> <span class="link"> <div class="title"><b> produtos /<i> products</i></b></div> <div class="text"> <a href="http://www.mafra.fot.br/photos/produtos.htm" target="_self" onFocus="if(this.blur)this.blur()"><img src="http://www.mafra.fot.br/photos/images/img_home-06.jpg" width="183" height="174" border="0"></a> </div> </span> <span class="link"> <div class="title"><b> contato /<i> contact</i></b></div> <div style="position:relative;text-align:center;margin:0px;font-family:verdana;font-size:32px;font-weight:bold;color:#FFF;overflow:hidden;height:90%"> <a href="mailto:mafra@mafra.fot.br?Subject=Contato - Contact"><img src="http://www.mafra.fot.br/photos/images/img_assina_home.gif" width="191" height="189" border="0"></a> </div> </span> <span class="link"> <div class="title"><b> contato /<i> contact</i></b></div> <div style="position:relative;text-align:center;margin:0px;font-family:verdana;font-size:32px;font-weight:bold;color:#FFF;overflow:hidden;height:90%"> <a href="mailto:mafra@mafra.fot.br?Subject=Contato - Contact"><img src="http://www.mafra.fot.br/photos/images/img_assina_home.gif" width="191" height="189" border="0"></a> </div> </span> </div> </div> <div style="position:relative; text-align:center; margin:0px; font-family:verdana; font-size:9px; font-weight:normal; color:#999999; overflow:hidden; height:131px; left: 414px; top: 474px; width: 172px;"> </div> <script type="text/javascript"> _uacct = "UA-1182901-1"; urchinTracker(); </script> </body> </html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

您可能感兴趣的文章:

js iframe网站后台左右收缩型页面脚本
其实和我的后台一样网站后台免费提供这里的样式的重点是指当鼠标移到三角按钮时变成手掌
2008-07-07
可折叠展开的简单目录实现代码
简单的目录，展开菜单，鼠标点击即可展开，再次点击即可合拢，类似树形菜单的功能，在浏览网页时会见很多，不多做介绍了，需要的朋友可以参考下
2012-12-12
JavaScript 下拉菜单实现代码
利用css+js实现的下拉菜单。通过getElementsByTagName获取ul,隐藏显示。
2009-05-05
js仿土豆视频滚动菜单
比较漂亮的仿土豆视频导航菜单，漂亮大方
2008-05-05
js仿淘宝的拼音检索特效代码
如果需要查询数据库,自己修改成ajax调用吧,效果会很好的.
2008-08-08
javascript仿126邮箱TAB切换效果
仿126中的绿色tab切换效果，比较漂亮
2008-09-09
利用js跨页面保存变量做菜单的方法
2008-01-01
javascript 定时自动切换的选项卡Tab
JavaScript配合CSS制作一个能自动切换的网页选项卡,每隔一段时间,它就自动切换选项卡列表和标题,时间自设.
2009-10-10
一个不错的渐显菜单
一个不错的渐显菜单...
2007-05-05
JavaScript CSS 菜单功能代码
CSS 菜单功能,多浏览器兼容性好
2008-12-12

javascript 弹性菜单，垂直的那种

相关文章

最新评论

大家感兴趣的内容

最近更新的内容

常用在线小工具