前端设计

   :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理

随笔分类 -  菜单导航

产品类网站多级导航菜单，像抽屉一样的菜单
摘要：像抽屉一样的菜单，多用在产品网站，比如IT产品网站的分类导航上，菜单结构清淅，样式新颖，设计美观，主要是运用JavaScript技术实现，用CSS配合实现菜单背景的构建，总体来说，是学习Js多级分类菜单的好范例。http://www.ij2ee.com/http://www.gbsou.com/<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><h 阅读全文
posted @ 2011-07-19 14:24 前端设计 阅读(348) 评论(0) 推荐(0)

二级的CSS菜单，鼠标移过显示子菜单
摘要：基于纯CSS实现的菜单，当鼠标划过的时候，子菜单会出现，没有过多修饰，简约不失美观，稍加修善就是一款好菜单。在兼容性方面，本菜单也做的不错。http://www.ij2ee.com/ http://www.gbsou.com/<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1 阅读全文
posted @ 2011-07-19 14:22 前端设计 阅读(840) 评论(0) 推荐(0)

DIV+CSS之仿DreamWeaver界面图形菜单
摘要：DIV CSS图形菜单之仿DreamWeaver，做了四个多小时才兼容好，火狐和IE都无Bug了，搞的自己快出Bug了。http://www.ij2ee.com/http://www.gbsou.com/<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml&q 阅读全文
posted @ 2011-07-19 14:18 前端设计 阅读(367) 评论(0) 推荐(0)

jQuery会翻滚的菜单导航条代码
摘要：jquery会翻滚的菜单导航条代码，鼠标放到某个菜单项上后，菜单会翻滚一下，增加一些动感的效果，看上去更可爱了，而且颜色搭配也挺不错的jQuery导航菜单。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head>< 阅读全文
posted @ 2011-07-19 14:13 前端设计 阅读(466) 评论(0) 推荐(0)

CSS弹出菜单
摘要：一款灰色风格的CSS弹出菜单，美化一般，重要是突出功能和实现方法，为CSS爱好者提供一份二级弹出菜单的样例，整体效果不错，兼容性也说得过去，高手可以继续完善。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head>< 阅读全文
posted @ 2011-07-19 14:10 前端设计 阅读(531) 评论(0) 推荐(0)

CSS灰色下拉菜单
摘要：CSS灰色下拉菜单，支持二级的导航菜单，如果不喜欢灰色的话，颜色你自己调整下，完善后效果是相当不错的。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" ><head><title>灰色下拉导航菜单 by www.c 阅读全文
posted @ 2011-07-19 14:09 前端设计 阅读(398) 评论(0) 推荐(0)

CSS树形菜单
摘要：不错的CSS树形菜单，树状列表，当然不全是CSS实现，部分功能还使用了JavaScript代码进行配合，删减了修饰用的菜单图片，大家用的时候自己图片加进去，IMG标签大部分都预留了出来，稍懂Html语法的朋友很容易就看懂的。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/19 阅读全文
posted @ 2011-07-19 13:47 前端设计 阅读(864) 评论(0) 推荐(0)

黑色个性的CSS3导航菜单
摘要：黑色个性的CSS3导航菜单，竖直排列的菜单，基本原理与横向的区别并不大，适合学习CSS。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type 阅读全文
posted @ 2011-07-19 13:45 前端设计 阅读(274) 评论(0) 推荐(0)

黑色导航菜单，CSS带阴影效果
摘要：黑色导航菜单，CSS带阴影效果，有立体感，鼠标放到菜单上会看到菜单的背景在变化，纯CSS的代码应用，没有使用任何的JavaScript代码。如果你觉得菜单的背景颜色和文字颜色不是您想要的，你还可以自己修改CSS文件，只要你有创意，一个漂亮菜单就会诞生。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml2/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/ 阅读全文
posted @ 2011-07-19 13:42 前端设计 阅读(748) 评论(0) 推荐(0)

鼠标经过切换背景的导航菜单
摘要：鼠标经过后切换背景的导航菜单，简单明了，给新手学习。已测试，兼容IE6、7、8、9，Firefox3、4、5、6，Chrome5以上，Opera，Safare，搜狗，遨游，360，TT<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">&l 阅读全文
posted @ 2011-07-19 13:41 前端设计 阅读(359) 评论(0) 推荐(0)

仿FLASH的竖排导航JS代码
摘要：CSS+Js实现Flash效果的导航菜单,竖向排列,兼容性好,由JavaScript妙味课堂的朋友编写,欢迎测试.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv=" 阅读全文
posted @ 2011-07-19 13:34 前端设计 阅读(321) 评论(0) 推荐(0)

Meizu魅族官方网站的jQuery导航菜单
摘要：偶尔看到魅族官方网站，发现网站的导航菜单的效果很不错就扣下来，俩字：给力。鼠标放到菜单上，菜单的下边会有一条横线在滑动。一直想找类似的效果学一下。结果，不是忘记有类似效果的网站的网址，就是压根儿找不到。。又不知道怎么描述，今天总算碰到了，真给力。代码:<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3. 阅读全文
posted @ 2011-07-19 13:18 前端设计 阅读(477) 评论(0) 推荐(0)

绝对酷的黑色风格二级导航菜单
摘要：代码:-----------------------<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.1//EN""http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"xml:lang="en"><head><metahttp-equiv="content-type"content="applica 阅读全文
posted @ 2011-07-19 13:18 前端设计 阅读(260) 评论(0) 推荐(0)

一款黑色漂亮的DIV+CSS导航条
摘要：代码:<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=gb2312" 阅读全文
posted @ 2011-07-19 13:17 前端设计 阅读(469) 评论(0) 推荐(0)

纯CSS下拉导航代码
摘要：分享一款纯CSS完成的下拉导航代码，蓝色经典色调，非常大气，适合政府和企业类网站作为顶部的导航菜单，浏览器兼容性完成OK，有需要的朋友可以拿去。<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd"><HTML xmlns="http://www.w3.org/1999/xhtml"><HEAD id=Head1> 阅读全文
posted @ 2011-07-19 13:13 前端设计 阅读(406) 评论(1) 推荐(0)