Space的gravatar头像
Space 2014-03-31 23:59:26

HTML5+CSS3实现iOS Path菜单特效,动画效果很酷

菜单动画很酷(酷、炫、吊炸天)

Path菜单相信大家都不陌生吧,它在iOS中非常流行,今天我们要分享的菜单就是利用HTML5和CSS3技术来模拟实现这款iOS Path菜单,点击按钮,即可弹出子菜单,子菜单弹出的动画非常炫酷。点击子菜单,即可打开相应功能。

其中里面用到less和coffeescript

名词解释:

 LESS是一个免费开源的,从Ruby的LESS library衍生而来。.LESS是一个允许web开发人员使用更加先进的语言特性的语法解析器,这些特性包括变量,操作符,嵌套规则。

CoffeeScript 是一种新的编程语言,构建于 JavaScript 之上,可编译成高效 JavaScript,除了可在 Web 浏览器中运行 JavaScript,您还可以将它与诸如 Node.js 一类的技术相结合用于构建服务器应用程序。

1、

HTML5+CSS3实现iOS Path菜单特效,动画效果很酷

2、点击上面图标后会变成下面(此处应该有动画)

HTML5+CSS3实现iOS Path菜单特效,动画效果很酷

3、然后那个星星图标也可以点击,点击后有特效,但是不好截图(请各位自己去尝试)


最代码官方编辑于2016-3-15 9:28:56


打赏

文件名:html5-css3-path-menu.rar,文件大小:42.557K 下载
  • /
      • /html5-css3-path-menu
          • /html5-css3-path-menu/coffeescript
            • /html5-css3-path-menu/coffeescript/index.coffeescript
          • /html5-css3-path-menu/css
            • /html5-css3-path-menu/css/style.css
        • /html5-css3-path-menu/index.html
          • /html5-css3-path-menu/js
            • /html5-css3-path-menu/js/index.js
            • /html5-css3-path-menu/js/jquery.js
            • /html5-css3-path-menu/js/prefixfree.min.js
          • /html5-css3-path-menu/less
            • /html5-css3-path-menu/less/style.less
最代码最近下载分享源代码列表最近下载
wsnmb123  LV3 2023年4月3日
13543528515  LV8 2021年9月6日
baishu  LV1 2021年2月4日
王子轩  LV2 2019年5月15日
jhgvcvghjkil  LV2 2019年1月1日
laoyaoshui  LV16 2018年12月12日
gsdgfbsdgbs  LV2 2018年11月21日
diyanzhao1  LV11 2018年8月31日
gogoLJY  LV1 2018年8月4日
1792312911  LV17 2018年7月12日
最代码最近浏览分享源代码列表最近浏览
fesfefe  LV13 2023年10月5日
632793503  LV7 2023年7月4日
szf123  LV12 2023年5月30日
wsnmb123  LV3 2023年4月3日
百尺尖头2016  LV2 2023年2月13日
969273312  LV1 2022年11月24日
1797751550  LV1 2022年6月19日
13543528515  LV8 2021年9月5日
nihaopengyou  LV1 2021年6月21日
wtyzbcml  LV2 2021年6月10日
顶部 客服 微信二维码 底部
>扫描二维码关注最代码为好友扫描二维码关注最代码为好友