来源:http://www.noupe.com/ajax/13-awesome-java-script-css-menu.html
翻译:http://parandroid.com
下面为你准备了13个利用Javascript实现的网页导航菜单
1) Sexy Sliding Menu
- 基于mootools的Javascript网页导航菜单,漂亮的滑动门技术,看到下面的图了没有,用它来设计你的Sidebar,非常之炫,Sexy,是的。
Demo: Mootols Version
Demo: Script.aculo.usVersion
2) FastFind Menu Script
-这个脚本基本动态的Ajax技术,可以让你创建多级嵌套的菜单。
Demo: FastFind Menu
3) Webber 2.0 Dock Menu
-一个典型的Dock类型网页导航菜单。
Demo: Webber 2.0 Dock Menu
4) Phatfusion- Image Menu
-这这是一个使用Javascript的图片导航菜单,它最大的特点是除了悬浮展开图片链接之外,还保持当前选定的菜单链接状态。
Demo: Phatfusion- Image Menu
Demo: Mootools version with XML parser
5) Drag and Drop ordering in a TreePanel
-这个好像是从著名的Ext JS提取的,一个树型导航菜单,灵感当然是来源于Windows的资源管理器,我相信是这样的。
Demo: Drag and Drop ordering in a TreePanel
6) Custom Menu Events
在同一时间内显示展示菜单的介绍和其它相关信息,其动态效果甚至达到Flash。不过缺点是需要再次刷新才能进行导航菜单的动态显示。
Demo: Custom Menu Events | ThinkVitamin.com
7) Context Menu Functionality
一个简洁轻巧的上下文本导航菜单,利于在用户浏览时达到一个良好的交互作用。
Demo: Context Menu Functionality
这是另一个DemoAnother Context Menu
8 ) LavaLamp jQuery Sliding Menu
一个基于jquery的滑动菜单效果,体积比较小巧。另一个版本是来自Guillermo Rauch
基于mootools所构建的。
Demo: LavaLamp jQuery Sliding Menu
Demo: Mootools Fancy Menu
9 ) Slashdot Menu- Dynamic Drive
这是一个流行的滑动/折叠导航菜单,是设计爱好者从著名网站Slashdot中提取的。其可控制性非常强,比如你可以设置为只准打前主菜单打开,或者全部打开,或同时收缩所有的子菜单等,且可以根据Cookie判断来显示菜单。
Demo: Slashdot Menu
10 ) Mootools menu with Accordeon and Effects
非常整洁的一个导航菜单,当鼠标悬浮的时候,当前链接就会伸展出来并且可以显示一个手风琴效果的二级菜单。
Demo: Mootools menu with Accordeon and Effects
11 ) CSS Dock Menu
这又是来自Nick la的Mac风格的鱼眼效果菜单,如果你对这种效果感兴趣,可以看一下我的另一篇文章:
多个Mac风格的鱼眼菜单(Dock Menu)免费下载和教程
相关链接
相关推荐
本资源包含了13个不同的JavaScript导航菜单实现,旨在帮助开发者了解和掌握各种导航菜单的设计技巧和实现方法。以下将对这些知识点进行详细阐述。 1. **动态创建与更新**: JavaScript 允许我们在网页加载后动态创建...
总结来说,CSS和JavaScript在导航栏设计中相辅相成,CSS负责美观和基本布局,而JavaScript则提供动态交互和更高级的功能。通过深入学习和实践这两个领域的知识,设计师可以创建出满足用户需求,同时具备优秀用户体验...
JavaScript导航菜单的常见特性包括: 1. **鼠标悬停效果**:当用户将鼠标指针悬停在菜单项上时,可能有高亮显示、下拉子菜单出现等效果。这可以通过监听`mouseover`和`mouseout`事件来实现。 2. **点击事件**:...
JavaScript 导航菜单特效是网页设计中不可或缺的一部分,它们为用户提供了友好的交互体验,使得网站的层级结构一目了然。在这个主题中,我们将深入探讨JavaScript如何用于创建动态、响应式的网页导航菜单。 首先,...
创建导航栏时,我们通常会用到`<nav>`标签来定义导航区域,`<ul>`和`<li>`标签来创建无序列表,代表导航链接,`<a>`标签则用于链接这些导航项。例如: ```html <li><a href="#home">首页</a></li> <li><a href...
标题中的“javascript导航栏脚本,苹果风格”指的是使用JavaScript编程语言实现的一种具有苹果公司设计风格的导航栏。苹果风格通常意味着简洁、优雅且高度互动的设计。在网页设计中,导航栏是用户界面的重要组成部分...
一个旋转导航菜单则通过视觉效果吸引用户的注意力,同时提供清晰的导航结构。本文将深入探讨如何使用JavaScript实现旋转导航菜单。 首先,我们需要理解基本的HTML和CSS来构建菜单的基础框架。HTML用于创建菜单的...
在本主题"22种JavaScript导航菜单效果"中,我们将深入探讨如何利用JavaScript实现各种动态和吸引人的导航菜单效果。这些效果可以极大地提升用户体验,使网站更具吸引力。 1. **静态到动态的转变**:JavaScript可以...
通常,这样的导航菜单会使用 JavaScript 来添加动态效果,比如悬停时的渐变颜色变化、下拉子菜单的滑动展示或者点击后菜单项的缩放效果。这些特效可以使用户更容易地浏览网站结构,同时增加视觉吸引力。 其次,...
this source is about a navigator supported by javascript.
在JavaScript实现的类似淘宝网顶部导航菜单的项目中,我们主要关注的是前端开发技术,特别是JavaScript作为主要的脚本语言,以及ECMAScript规范对它的影响。这个demo旨在模拟淘宝网的用户界面,提供购物车、收藏夹、...
"超强的JavaScript导航条"是一个专门针对这个需求的实现,旨在提供一种高效、功能丰富的导航解决方案。 导航条在网站设计中的作用主要体现在以下几个方面: 1. **用户体验**:一个清晰、响应式的导航条能让用户快速...
在JavaScript编程领域,创建动态和交互式的网页元素是常见的需求之一,其中导航菜单是一个至关重要的组成部分。本项目“JavaScript---仿chinaz站长站首页的导航菜单”旨在利用JavaScript技术实现与知名网站ChinaZ...
标题 "xml导出javascript&css多级导航栏" 涉及到的技术点主要集中在XML、JavaScript和CSS三个核心领域,这些技术在Web开发中扮演着至关重要的角色。以下是关于这些知识点的详细说明: 1. **XML(Extensible Markup ...
在本辑资源中,我们有24款不同风格和功能的JavaScript导航条,包括下拉菜单导航条、二级联动导航条以及带有Flash效果的导航条。这些导航条设计独特,不仅能满足视觉上的美观需求,还能提升用户体验,使网站更具互动...
这个"javascript经典特效---三层导航菜单.rar"压缩包文件显然聚焦于使用JavaScript实现动态的、交互式的三层导航菜单。这种菜单在网页设计中非常常见,因为它能够帮助用户高效地浏览和访问网站的多层次结构。 三层...
javascript制作的动态导航栏,javascript制作的动态导航栏
本主题将深入探讨如何使用JavaScript编写各种上下导航栏菜单效果,以及它们在实际应用中的重要性。 一、JavaScript基础 在构建导航菜单之前,我们需要对JavaScript的基础有所了解。JavaScript是一种解释型的、面向...
本文将深入探讨“超炫的导航菜单”这一主题,它利用JavaScript技术实现了动态的、视觉效果丰富的交互式菜单。 首先,我们要理解JavaScript在这个场景中的作用。JavaScript是一种广泛使用的客户端脚本语言,它允许...
首先,我们从“JavaScript导航菜单”这个主题出发,理解导航菜单的基本结构。一个标准的导航条通常包含一系列链接,这些链接可以是页面的各个部分或子页面。通过JavaScript,我们可以为这些链接添加交互性,如悬停...