个性化jQuery和CSS3菜单源码

时间:2014-09-14

  下面要给大家分享8款非常个性化的jQuery和CSS3菜单,这些菜单由于外观比较独特,所以也许不是非常通用,但是我们可以认可的是这些菜单的设计思路非常棒,值得借鉴。下面一起来看看这些菜单吧。

  1、超酷的jQuery动画菜单

个性化jQuery和CSS3菜单源码 三联教程

  这是一款效果非常酷的jQuery动画菜单导航,当你把鼠标移到菜单项的时候,将会出现十分平滑的滑动效果,这个菜单漂亮的地方还在于菜单的背景图片,动画本身并不复杂,下面就一起来看看这个简单漂亮的jQuery动画菜单吧。

  2、jQuery侧边固定停靠导航

  这是一款非常精美的jQuery侧边固定停靠导航菜单,鼠标移入移出是都有流畅的弹入弹出效果,并能固定在浏览器一侧,不随着滚动条下拉而下滑。

  3、jQuery和CSS3图片下拉菜单

  这是一款基于jQuery和CSS3的图片下拉菜单,当鼠标移到菜单项上时,菜单上就会弹出一张该菜单项的主题图片,并以下拉的方式显示该菜单项的具体说明。下拉过程十分流畅。

  4、CSS3 动画导航按钮

  这是一组基于CSS3的动画导航按钮,该动画导航会在鼠标移上去之后播放一段对应的小动画,效果十分时尚。不过注意的是,该动画导航只能在基于WebKit的浏览器上才能运行,如Chrome。下面就一起来看看这款CSS3导航。

  5、丝带状的CSS导航

  这是一款利用纯CSS实现的丝带状的导航菜单,该CSS导航简单而又大方,犹如悬挂在蓝天之上,又仿佛倒映在碧水之中,确实是一个让人看了赏心悦目的CSS导航。

  6、CSS3仿Windows 7的开始菜单

  这是一款用纯CSS3实现的仿Win 7的开始菜单。如果我们分解这个Windows 7开始菜单,我们会得到1个div,2个ul列表,1组链接以及一些icon小图标,我们可以一起来看看具体的效果。

  7、jQuery动画菜单jStackmenu

  jStackmenu是一款基于jQuery的堆栈式动画菜单,当你用鼠标点击那个“爱心”按钮时,jStackmenu菜单就会以堆栈方式弹出或者收拢,并呈现出流畅的动画特效。

  8、银白色的CSS3导航菜单

  这是一款纯CSS3制作的导航菜单,这个银白色的菜单在朦胧夜空的衬托下显得格外亮丽。当鼠标滑过导航时,每个菜单项又会呈现不同的效果,整体上,这款CSS3导航菜单非常简单而又具有立体感。

  以上就是8款个性化的jquery和css3菜单导航,喜欢的朋友可以收藏。

上一篇:WEBIM v5的那点事儿 下一篇:产品经理核心工具:Web流程图的绘画指南

相关文章

最新文章