[JavaScript&CSS]Javascript和CSS的菜单

简介:

【译文地址】:http://coolshell.cn/?p=1660
【原始地址】:13 Awesome Javascript CSS Menus

1) 性感的滑动型菜单 

Sexy-menu - 13不错的Javascript CSS菜单

演示: Mootols Version
演示:Script.aculo.usVersion

 

 


2) FastFind 菜单 右键菜单,还可以被拖来拖去。使用 jQuery 。

Fastfind - 13不错的Javascript CSS菜单

演示: FastFind Menu

 


3) Webber 2.0 Dock 菜单

Dockmenu - 13不错的Javascript CSS菜单

演示: Webber 2.0 Dock Menu

 


4) Phatfusion- 图片菜单 使用了onClick 事件来 open 和 close 菜单项。

Phatfusion - 13不错的Javascript CSS菜单

演示: Phatfusion- Image Menu
演示: Mootools version with XML parser

 


5) 可拖动的树形菜单

 Tree - 13不错的Javascript CSS菜单

演示: Drag and Drop ordering in a TreePanel

 


6) 自定义的菜单事件

Custom - 13不错的Javascript CSS菜单

演示: Custom Menu Events | ThinkVitamin.com

 


7) 右键菜单

Custom - 13不错的Javascript CSS菜单

演示: Context Menu Functionality
演示:Another Context Menu

 


8 ) LavaLamp jQuery 滑动菜单

Lavalamp - 13不错的Javascript CSS菜单

演示: LavaLamp jQuery Sliding Menu
演示: Mootools Fancy Menu

 


9 ) 折叠式菜单

9 - 13不错的Javascript CSS菜单

演示: Slashdot Menu

 


10 ) Mootools层叠式菜单

10 - 13不错的Javascript CSS菜单

演示: Mootools menu with Accordeon and Effects

 


11 ) CSS Dock 菜单 模仿Mac 电脑界面。 

11 - 13不错的Javascript CSS菜单

演示: CSS Dock Menu

 


12 ) jQuery 插件:滑动式菜单

12 - 13不错的Javascript CSS菜单

演示: jQuery Plugin: Sliding Menu

 


13 ) 折叠式菜单

13 - 13不错的Javascript CSS菜单

演示: Accessible expanding and collapsing menu


本文转自Justin博客园博客,原文链接:http://www.cnblogs.com/justinw/archive/2009/12/19/1627703.html,如需转载请自行联系原作者

相关文章
|
2月前
|
前端开发
导航新风尚:CSS梯形设计,让网站菜单不再单调!
导航新风尚:CSS梯形设计,让网站菜单不再单调!
|
10天前
|
JavaScript 前端开发
JavaScript HTML DOM - 改变CSS
JavaScript HTML DOM - 改变CSS
17 4
|
8天前
|
前端开发 JavaScript
HTML+JavaScript+CSS DIY 分隔条splitter
HTML+JavaScript+CSS DIY 分隔条splitter
|
10天前
用CSS+JavaScript打造网页中的选项卡
用CSS+JavaScript打造网页中的选项卡
|
13天前
|
JavaScript 前端开发
JS配合CSS3实现动画和拖动小星星小Demo
本文通过代码示例展示了如何使用JavaScript和CSS3实现动画效果和拖动小星星的交互效果,包括文字掉落动画和鼠标拖动产生小星星动画的实现方法。
28 0
JS配合CSS3实现动画和拖动小星星小Demo
|
19天前
|
前端开发 JavaScript
uniapp动态修改css样式(通过js来修改css样式)
uniapp动态修改css样式(通过js来修改css样式)
|
27天前
|
Web App开发 前端开发 JavaScript
HTML/CSS/JS学习笔记 Day3(HTML--网页标签 下)
HTML/CSS/JS学习笔记 Day3(HTML--网页标签 下)
|
24天前
|
XML JavaScript 前端开发
JavaWeb基础4——HTML,JavaScript&CSS
HTML,JavaScript&CSS、元素、标签、css 选择器、属性、JavaScript基础语法、JavaScript对象、BOM浏览器对象模型、DOM文档对象模型、事件监听、正则对象RegExp/ES6
JavaWeb基础4——HTML,JavaScript&CSS
|
10天前
|
JavaScript 前端开发
网页前端课程设计-【模仿】香港中文大学官网,轮播图及div+css布局,js的dom操作
这篇文章介绍了如何模仿香港中文大学官网进行网页前端课程设计,包括使用div+css布局、js的DOM操作以及实现轮播图等技术细节。
|
1月前
|
前端开发 JavaScript
JavaScript 动态更新 CSS
【9月更文挑战第01天】
16 2