7款风格新颖的jQuery/CSS3菜单导航分享

 更新时间:2013年04月23日 16:38:56   作者:  
下面给大家分享7款风格新颖的jQuery/CSS3菜单导航让用户方便地找到想要的信息,而且更让人有一种特殊的用户体验,希望大家会喜欢

一款优秀的菜单对网站而言是非常重要的,它不仅可以让用户方便地找到想要的信息,而且更让人有一种特殊的用户体验。下面给大家分享7款风格新颖的jQuery/CSS3菜单导航,希望大家会喜欢。

1、CSS3立体飘带状菜单

CSS3立体飘带状菜单,该菜单鼠标滑过时,菜单项向上立体凸起,结合黑色的木质背景,整个菜单显得非常立体生动。


在线演示 /源码下载

2、CSS3个人资料导航菜单

该菜单是用来展示登录的用户信息,包括用户的快捷操作按钮,另外菜单还提供一个个性化的搜索框。


在线演示 /源码下载

3、jQuery顶部浮动渐变工具栏

jQuery顶部浮动渐变工具栏是一款基于jQuery的顶部导航插件,默认该菜单不显示,当页面向下滚动时,该顶部菜单就会逐渐显示出来,页面滚动到一定距离时,菜单会全部显示。页面距离由JS自动判断。


在线演示 /源码下载

4、CSS3彩色多功能下拉菜单导航

这是一款强大的菜单导航,菜单集成了搜索、普通下拉菜单、带图标的下拉菜单这些功能,而且色彩很丰富,是一款非常实用的网页菜单导航。

在线演示 /源码下载

5、灰色超具立体感的CSS3导航按钮

这款菜单导航提供了水平和垂直两种菜单模式,鼠标滑过菜单项时非常具有立体感,很棒的一个网页素材。

在线演示 /源码下载

6、CSS3黑色动画菜单导航

这款菜单以黑色为背景,背景中又有气泡作为点缀。菜单项以白色为主,鼠标滑过菜单项出现动画效果,非常酷的一款CSS3菜单。


在线演示 /源码下载

7、带小图标的jQuery多级菜单导航

这款菜单不仅是多级菜单,而且每一个菜单项都可以设置菜单的功能图标,因此非常实用。


在线演示 / 源码下载

以上就是7款风格新颖的jQuery/CSS3菜单导航,部分特效示例由脚本之家提供,欢迎收藏。

相关文章

  • jQuery旋转插件—rotate支持(ie/Firefox/SafariOpera/Chrome)

    jQuery旋转插件—rotate支持(ie/Firefox/SafariOpera/Chrome)

    网上发现一个很有意思的jQuery旋转插件,支持Internet Explorer 6.0+ 、Firefox 2.0 、Safari 3 、Opera 9 、Google Chrome,高级浏览器下使用Transform,低版本ie使用VML实现,感兴趣的朋友可以了解下
    2013-01-01
  • Jquery+CSS 创建流动导航菜单 Fluid Navigation

    Jquery+CSS 创建流动导航菜单 Fluid Navigation

    有时,一个网站的导航菜单文字不能提供足够的信息,来表达当前菜单按钮的内容,一般的解决办法是使用提示信息ToolTip,那么本文介绍的流动导航菜单Fluid Navigation也可以解决此问题,同时也为网站设计的添加了一些时尚而又动感元素。
    2010-02-02
  • jquery下利用jsonp跨域访问实现方法

    jquery下利用jsonp跨域访问实现方法

    客户端的跨域访问,可以通过jsonp方式来实现,jquery提供了跨域访问的方法,jQuery.ajax()支持get方式的跨域。当然支持跨域还需要服务器端相应的处理。
    2010-07-07
  • 简述jQuery Easyui一些用法

    简述jQuery Easyui一些用法

    这篇文章主要介绍了jQuery Easyui一些用法,非常不错,具有参考借鉴价值,需要的的朋友参考下吧
    2017-08-08
  • jquery 合并内容相同的单元格(示例代码)

    jquery 合并内容相同的单元格(示例代码)

    这篇文章主要是对jquery合并内容相同的单元格示例代码进行了介绍。需要的朋友可以过来参考下,希望对大家有所帮助
    2013-12-12
  • 使用Jquery实现每日签到功能

    使用Jquery实现每日签到功能

    签到功能现在算是社交化网站增加网站粘合度的一个普遍做法了,于是也想在自己的项目中添加一个,经过一番度娘,终于完成,这里分享给大家,有需要的小伙伴可以参考下。
    2015-04-04
  • jquery Validation表单验证使用详解

    jquery Validation表单验证使用详解

    功能强大的 jquery 表单验证插件,适用于日常的 E-mail、电话号码、网址等验证及 Ajax 验证,除自身拥有丰富的验证规则外,还可以添加自定义的验证规则。兼容 IE 6+, Chrome, Firefox, Safari, Opera 10+
    2015-04-04
  • jQuery选取所有复选框被选中的值并用Ajax异步提交数据的实例

    jQuery选取所有复选框被选中的值并用Ajax异步提交数据的实例

    下面小编就为大家带来一篇jQuery选取所有复选框被选中的值并用Ajax异步提交数据的实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-08-08
  • js实现表格筛选功能

    js实现表格筛选功能

    本文主要介绍了js实现表格筛选功能的代码。具有一定的参考价值,下面跟着小编一起来看下吧
    2017-01-01
  • jquery 框架使用教程 AJAX篇

    jquery 框架使用教程 AJAX篇

    正好项目中准备使用thickbox,于是干脆抛弃prototype.js,看起jquery.js了。JQuery确实不错,体积比Prototype小了许多,而且使用起来更方便更灵活。有人说Prototype像JAVA,正统;而JQuery像Ruby,灵活,更趋于OOP。
    2009-10-10

最新评论