摘要：简介 CSS3的animation类似于transition属性，他们都是随着时间改变元素的属性值。他们主要区别是transition需要触发一个事件(hover事件或click事件等)才会随时间改变其css属性；而animation在不需要触发任何事件的情况下也可以显式的随着时间变化来改变元素css的属性值，从而达到一种动画的效果。这样我们就可以直接在一个元素中调用animation的动画属性,基于这一点，css3的animation就需要明确的动画属性值，支持的浏览器 目前支持application cache的浏览器如下：n IE 10+n Firefox 12+n Chome 19+. 阅读全文
Css3 Transform
2012-07-04 10:44 by BlackBird, 480 阅读, 0 推荐, 收藏, 编辑
摘要：简介通过对于元素进行transform设置达到一些变形的效果transform包含以下几种：n rotate 旋转n skew 扭曲n scale缩放n translate 移动n matrix 矩阵变换支持的浏览器 目前支持application cache的浏览器如下：n IE 9+n Firefox 3.6+n Chome 17+n Safari 5+n Opera1 1.6+n Android browser 2.1+n Ios safari 3.2+ 语法标准写法transform ： none | <transform-function> [ <transform 阅读全文
Css3 Transition
2012-07-04 10:38 by BlackBird, 337 阅读, 0 推荐, 收藏, 编辑
摘要：简介通过对于元素进行transition设置允许css的属性值在一定的时间区间内平滑地过渡。这种效果可以在鼠标单击、获得焦点、被点击或对元素任何改变中触发，并圆滑地以动画效果改变CSS的属性值。支持的浏览器 目前支持application cache的浏览器如下：n IE 10+n Firefox 8+n Chome 17+n Safari 5+n Opera1 11.6+n Android browser 2.1+n Ios safari 3.2+ 语法标准写法transition ： [<'transition-property'> || <'tr 阅读全文
离线中技术方案的场景
2012-06-26 11:34 by BlackBird, 545 阅读, 0 推荐, 收藏, 编辑
摘要：在使用到离线技术中，会涉及到web storage，application cache，web sql等新技术的运用，可能对于某一种需求，均可以用这些特性来实现，但是我们需要杜绝这些技术的滥用，需要仔细分析最初的需求，在某些场景应该有征对性地引入。 application cache 文件级别缓存，指定离线状态和在线状态，类似离线应用程序，以文件单元进行存储，实现的是离线浏览，没有网络的浏览，相挂钩的是文件的url，每一个url都会在加载的过程中返回。 对应产品线实例：JS框架，图片，用户资源文件（用户头像修改历史）。所有想以文件的方式进行离线存储的产品线web storage... 阅读全文
Web SQL API
2012-06-26 11:29 by BlackBird, 3254 阅读, 0 推荐, 收藏, 编辑
摘要：简介 Web SQL数据库API实际上未包含在HTML 5规范之中，它是一个独立的规范，它引入了一套使用SQL操作客户端数据库的API。这些 SQL 语句可以直接在 js中编写运行，并且带有基本的数据库事务性的支持。兼容浏览器 chrome 17+ Safari5+ opera11.6+ iOS Safari3.2+ Opera Mobile11.0+ Android Browser2.1+接口 var db = openDatabase('mydb', '1.0', 'Test DB', 2 * 1024 * 1024); db.transac 阅读全文
Web Storage API
2012-06-18 16:19 by BlackBird, 2309 阅读, 1 推荐, 收藏, 编辑
摘要：web storage内容web storage提供在浏览器端通过key/value的方式存储数据。包括以下两部分： session storage（会话级别的存储，会话结束后失效） local storage（持久性存储，用户主动删除或js操作清空）web storage优势web storage的提出的初衷主要是为了解决cookie在数据存储时的一些不足。和cookie相比，web storage主要有以下几点优势： 存储空间大，默认5m 节省带宽，不用在每次请求中发送到服务器端 操作简便，封装了很多便捷的操作方法 数据独立性强支持web Storage的浏览器chrome... 阅读全文
Application Cache API （二）
2012-06-14 09:31 by BlackBird, 2380 阅读, 0 推荐, 收藏, 编辑
摘要：开这个博客的初衷主要是想沉淀一下我最近即将开展的对于HTML5及移动端性能方面的一些探索，而appcache我们更加关注的是缓存策略上对于性能的优化上的帮助，所以对于appcache的运行过程我们需要更加地清楚，昨天的Application Cache API （一）整体介绍了一下appcache，接下来会对appcache做一些黑盒测试，以便我们了解更多。 这个demo中主要涉及到3类资源，两个页面，我们观察3类资源在不同的场景下浏览器的appcache策略。 demo代码： test1.html如下：<html manifest="manifest.appcache&quo 阅读全文
Application Cache API （一）
2012-06-12 18:51 by BlackBird, 12101 阅读, 3 推荐, 收藏, 编辑
摘要：什么是Application Cache API？HTML5提供了一系列的特性来支持离线应用： application cache localStrorage web SQL & indexed database online/offline events本文要讲的是application cache。传统的web程序中浏览器也会对资源文件进行cache，但是并不是很可靠，有时起不到预期的效果。而HTML5中的application cache支持离线资源的访问，为离线web应用的开发提供了可能。哪些浏览器支持Application Cache API？ 目前支持applicatio. 阅读全文