一款非常实用的jQuery和CSS3css3圆形导航菜单彈性伸缩导航菜单按钮特效该导航菜单初始状态是一个css3圆形导航菜单的按钮，当用户用鼠标点击或移动手机上用手触摸了按钮之后该css3圓形导航菜单按钮平滑的伸缩变形为圆角导航菜单，效果非常酷
该弹性伸缩导航菜单按钮有3种特效：固定导航菜单，添加内容按钮和编輯内容按钮

菜单动画的基本原理是：设置span.stretchy-nav-bg一个固定的高度和宽度（和a.cd-nav-trigger大小一样），当导航菜单被打开的时候使用.nav-is-visible class来制作菜单的高度动畫（或者宽度动画），以创建菜单的拉伸效果

对于导航菜单项，特效中定制了2种不同的CSS动画：scaleIn动画将作用域菜单项的图标slideIn动画将作用於菜单项的标签。然后为每一个菜单项添加一些不同的动画延迟时间

对于后面两种工具条效果，当导航菜单打开的时候仅会显示图标（使用scaleIn动画）而菜单项的文本会在鼠标滑过菜单项时才显示出来。

纯CSS3css3圆形导航菜单导航菜单

讨论这个素材（1）回答他人问题或分享使用心得会奖励牛币