其实这个示例蛮无聊的 很简单 也没什么实际的用处.

主要是展示了 CSS3 如何实现动画效果.

写这个主要是想看一看 完成这样的效果 我到底要写多少代码. 
同时和我熟悉的java做个比较.

比较结果不用我说大家也知道.

用java来实现示例中的效果 如果不借助第三方的框架 编码量将是相当大的.

就算用flash 来做 编码量也不小. 
也许有人会说用flash开发这么一个东西, 在强大的开发工具的帮助下根本不用编码, 
呵呵 好吧... 
其实这种质疑恰恰证明了为什么很多flash应用看着简单 但是对cpu占用却非常高.

之前我在"闲聊"里说过:"从技术角度来讲,HTML5+CSS3+JS太适合做休闲类游戏了" 
大家想想,用canvas svg webgl等技术 来做游戏主体, js来做游戏开发语言(同时也可以用来做脚本), 利用html5 css3的优雅特性来做游戏的UI(就是菜单 对话框 操作控制台一类的东西).这样不是很好吗?

不废话了 大家看附件中的示例吧.

请使用 Chrome 4.x 或以上版本进行预览. (我用的是 4.1 )

补充 : safari 4 也可以

animate_ui.zip (855 Bytes)

CSS3 实现的一个简单的"动态主菜单" 示例[转]的更多相关文章

  1. CSS3 实现的一个简单的"动态主菜单" 示例

    其实这个示例蛮无聊的 很简单 也没什么实际的用处. 主要是展示了 CSS3 如何实现动画效果. 写这个主要是想看一看 完成这样的效果 我到底要写多少代码. 同时和我熟悉的java做个比较. 比较结果不 ...

  2. 一个简单JDK动态代理的实例

    动态代理的步骤: 创建一个实现了InvocationHandler接口的类,必须重写接口里的invoke()方法. 创建被代理的类和接口 通过Proxy的静态方法 newProxyInsatance( ...

  3. 一个简单 JDK 动态代理的实例

    动态代理的步骤: 创建一个实现了 InvocationHandler 接口的类,必须重写接口里的 invoke()方法. 创建被代理的类和接口 通过 Proxy 的静态方法 newProxyInsat ...

  4. 从一个简单的Java单例示例谈谈并发

    一个简单的单例示例 单例模式可能是大家经常接触和使用的一个设计模式,你可能会这么写 public class UnsafeLazyInitiallization { private static Un ...

  5. 从一个简单的Java单例示例谈谈并发 JMM JUC

    原文: http://www.open-open.com/lib/view/open1462871898428.html 一个简单的单例示例 单例模式可能是大家经常接触和使用的一个设计模式,你可能会这 ...

  6. 一个简单的java僵局演示示例

    在实际编程,为了避免死锁情况,但是,让你写一个有用的程序死锁似几乎不要太简单(种面试题),下面是一个简单的死锁样例. 线程的同步化可能会造成死锁,死锁发生在两个线程相互持有对方正在等待的东西(实际是两 ...

  7. 一个简单的Kubernetes应用部署示例

    说明 我们通过一个示例来演示一下kubernetes部署应用的基本配置. 这个示例相对比较简单,就是一个tomcat应用加上一个mysql数据库 在tomcat里运行一个简单的webappp,这个ap ...

  8. django学习-11.开发一个简单的醉得意菜单和人均支付金额查询页面

    1.前言 刚好最近跟技术部门的[产品人员+UI人员+测试人员],组成了一桌可以去公司楼下醉得意餐厅吃饭的小team. 所以为了实现这些主要点餐功能: 提高每天中午点餐效率,把点餐时间由20分钟优化为1 ...

  9. 【Unity Shaders】Reflecting Your World —— 在Unity3D中创建一个简单的动态Cubemap系统

    本系列主要参考<Unity Shaders and Effects Cookbook>一书(感谢原书作者),同时会加上一点个人理解或拓展. 这里是本书所有的插图.这里是本书所需的代码和资源 ...

随机推荐

  1. QtCreator源码分析—2.启动主程序（4篇）

    QtCreator采用插件体系结构.主程序启动插件管理器(PluginManager),再通过插件管理器加载其插件,QtCreator的所有功能均使用插件实现. 我们先来分析主程序对插件管理器的主要操 ...

  2. SpannableString的基本用法

    原文地址:http://www.cnblogs.com/kross/p/3645594.html 以前一直好奇QQ的输入框里面是如何出现表情的,今天看了下这个,心中发出“原来是这样啊”的感叹. 通常情 ...

  3. .net对Redis集群的调用（FrameWork版本4.0）

    使用 StackExchange.Redis 实现.net对Redis集群的调用,方法如下: 1.打开 项目-管理NuGet程序包 2.在打开界面搜索StackExchange.Redis,找到Sta ...

  4. IE userdata 原理 应用 详解

    https://www.cnblogs.com/chyong168/archive/2012/04/24/2467505.html 在Internet Explorer 5中,Microsoft提供了 ...

  5. jmeter 正则表达式提取

    引用名称:自己定义的变量名称,后续请求将要引用到的变量名,如填写的是:id,后面的引用方式是${id} 正则表达式:提取内容的正则表达式,相当于lr中的关联函数 [()     括起来的部分就是需要提 ...

  6. HDU3046_Pleasant sheep and big big wolf

    给一个n*m的数字阵,1表示羊的位置,2表示狼的位置,0表示没有东西,可以通过.在每个格子的4边都可以建立围栏,有围栏的话狼是不能通过的. 现在求最少建立多少围栏能够保证狼无法接触到羊. 题目的模型很 ...

  7. 018 final 关键字的用途

    final关键字的含义 final在Java中是一个保留的关键字,可以声明成员变量.方法.类以及本地变量.一旦你将引用声明作final,你将不能改变这个引用了,编译器会检查代码,如果你试图将变量再次初 ...

  8. 2017/10 冲刺NOIP集训记录：暁の水平线に胜利を刻むのです!

    前几次集训都没有记录每天的点滴……感觉缺失了很多反思的机会. 这次就从今天开始吧!不能懈怠,稳步前进! 2017/10/1 今天上午进行了集训的第一次考试…… 但是这次考试似乎是近几次我考得最渣的一次 ...

  9. Android热修复原理（一）热修复框架对比和代码修复

    在Android应用开发中,热修复技术被越来越多的开发者所使用,也出现了很多热修复框架,比如:AndFix.Tinker.Dexposed和Nuwa等等.如果只是会这些热修复框架的使用那意义并不大,我 ...

  10. Luogu 1020 导弹拦截（动态规划，最长不下降子序列，二分，STL运用，贪心，单调队列）

    Luogu 1020 导弹拦截(动态规划,最长不下降子序列,二分,STL运用,贪心,单调队列) Description 某国为了防御敌国的导弹袭击,发展出一种导弹拦截系统.但是这种导弹拦截系统有一个缺 ...