CSS3Animation案例分享、动画手册、动画工具

CSS3动画参考

随着浏览器对CSS3动画的支持越来越好(IE除外,IE10用户量还非常的少),以前很多只能用flash或者javascript实现的动画效果,现在用CSS3动画也能部分的实现了。作为一个前端攻城狮,我们有足够的理由去使用CSS3动画让用户有更好的体验。

关于使用

「案例分享」集合了诸多CSS3动画相关但不仅限于CSS3动画的项目案例,均来自网友提供,可以在这里查阅相关DEMO或查找灵感,点击跳转至原目标站点。如果您有更好的URL,恳请提交。

「动画手册」保持以往的查阅习惯,保留语法、说明、属性取值、实例和兼容性说明,希望在实践中能便捷。

「动画工具」在手册资料的基础上,加上智能的在线调试、演示预览、导出代码等功能。目前包括“变形与过渡”、“自定义动画”与“动画库预设”。
“自定义动画”提供多个层与帧的设想,同时调试与设计。

动画工具[Tool] – CSS3动画参考by Tencent ECD | DMDC

CSS3动画案例分享:http://ecd.tencent.com/css3/index.html
CSS3动画参考手册:http://ecd.tencent.com/css3/guide.html
CSS3动画制作工具:http://ecd.tencent.com/css3/tools.html

20个最新的 CSS3 和 HTML5 工具

1. Sencha Animator
用标准的网页技术打造超炫的动画,Senchar Animator使用CSS3来打造动态的文字和图片,流畅的变换,阴影,渐变等效果。

2. CSS LINT 
这个工具可以帮你找出你CSS中的问题。不光是语法错误,它还能指出你的代码写的不合理的地方,或者不高效的地方。

3. Normalize.css
Normalize.css 是一个可以定制的CSS文件,它让不同的浏览器在渲染网页元素的时候形式更统一。

4. Spritemapper
Spritemapper 是一个组合不同图片并生成 CSS 位置代码的工具。

5. holmes.css
这个CSS可以帮你找出你网页中写的不标准的HTML代码。

6. prefixMyCSS
这个工具可以帮你的CSS代码添加前缀。

7. Sprite Cow
这个工具可以帮助你创建CSS Sprite。

8. Patternizer
这个工具可以帮助你创建复杂条纹图案的CSS。

9. Prefixr
这个工具可以帮助你创建跨浏览器的CSS代码。输入你的CSS代码,然后勾选一些选项,它就会生成各个浏览器兼容的CSS给你。

10. Patternify
这个工具是一个简单的CSS生成器。你可以直接在它的网页上画出你想要的样式,然后它就会生成相应的CSS给你。

11. CSS Shapes
这个工具可以帮你用纯CSS来生成各种图形。

12. Initializr
这个工具可以帮助你生成一个标准的HTML5网页模板,然后你可以基于这个模板完成你的网页。

13. Gury
Gury 可以帮助你创建基于 Canvas 的动画。

14. oCanvas
oCanvas 可以帮助你很容易的在 HTML5 的 Canvas 标签上创建对象,并且创建这些对象的动画。

15. Modernizr
Modernizr 是一个利用 JS 和 CSS 来检测浏览器说支持功能的小工具。

16. Response JS
Response JS 是一个轻量级的 jQuery 插件,用来创建高性能的支持移动设备的网站。它提供了一套语法用来根据不同的环境动态替换HTML代码。例如根据屏幕大小,动态的替换img标签的src地址。

17. Mercury Editor
这是一个全功能的 HTML5 编辑器,可以帮助你的团队在浏览器中编辑文档。

18. Sugar
Sugar 是一个JavaScript库。它扩展了现有的JS对象的方法,让你可以用更少的代码做更多的事情。

19. Buzz
Buzz 是一个用于操作HTML5音频标签的JavaScript library 。它是一个没有用到其它JavaScript框架独立Library。并拥有丰富的API可以用来管理这个音频标签提供的所有功能。支持的功能包括播放、 暂停、停止、循环和音量控、取得音频信息、判断音频类型是否支持、可同时处理多个音频文件。还可以取得播放结束、错误产生或音量变化等事件。

20. Recurly.js
Recurly.js 是另一个 JS 实现的表单美化插件。

Adobe CS6全系列正式版发布附下载地址及破解补丁

什么是 Creative Suite?

Adobe Creative Suite 6 (Adobe CS6)软件可提供崭新的数字媒体开发体验,使您能够快速工作,以及随时随地为受众提供服务。您可以随时灵活地下载和安装这些应用程序,并获得其他新提供的应用程序、新功能和服务。

Adobe Creative Suite family

Adobe官方终于宣布正式发布Adobe CS6正式版 (Creative Suite 6终极设计套装),Adobe CS6正式版包含四大套装和十四个独立程序,如:设计标准版,设计与网络高级版,大师典藏版,产品高级版,同时还发布了创意云(Creative Cloud)服务,可以让用户下载任意Adobe CS6产品。

Adobe CS6正式版包含的产品:

Adobe CS6正式版套装:

设计标准版 CS6 (Design Standard CS6)

设计与网络高级版 CS6 (Design & Web Premium CS6)

产品高级版 CS6 (Production Premium CS6)

大师典藏版 CS6 (Master Collection CS6)

Adobe CS6正式版独立软件:

Photoshop CS6
Photoshop CS6 Extended
Illustrator CS6
InDesign CS6
Acrobat X Pro
Flash Professional CS6
Flash Builder 4.6 Premium Edition
Dreamweaver CS6
Fireworks CS6
Premiere Pro CS6
After Effects CS6
Audition CS6
SpeedGrade CS6
Prelude CS6
Encore CS6
Bridge CS6
Media Encoder CS6

Photoshop CS6介绍:

Creative Suite 6终极设计套装,做为整个套装的灵魂,Photoshop CS6、Photoshop CS6 Extended自然是大家最为关注的。Adobe宣称,得益于Adobe Mercury Graphics Engine图形引擎,用户可以在新版中感受到“不可思议的性能”,使用任何编辑工具都可以即时得到结果,比如液化、操纵变形、光照效果等等。

- 新设计的灰暗色用户界面(可自定义)
- 拓展的内容感知技术群,新增内容感知修补、内容感知移动
- 全新的裁剪工具
- 更丰富的文字各式
- 新的矢量图层
- 新的图案样式(Scripted Patterns)
- 支持创建、编辑和增强视频
- 适应性宽角度滤镜
- 新的模糊效果
- 整合Adobe Camera Raw 7
- 丰富的画笔工具集
- Mercury Graphics Engine for 3D图形引擎
- 3D内容控制与效果
- 增强的工作流(仅限Photoshop Extended版本)

Illustrator CS6介绍:

Illustrator CS6也重新设计了更为现代化的用户界面,特性方面包括新的图像追踪引擎、简单的图案创建、笔画斜度等等,特别是Mercury Performance System带来了更快的速度和更强的稳定性,并支持64位的Windows、Mac OS X操作系统。

Adobe CS6全系列正式版发布 (Creative Suite 6终极设计套装)

InDesign CS6介绍:

InDesign CS6加入了新的Adaptive Design Tools(适应性设计工具),包括Alternate Layout(交互布局)、Liquid Layout(液体布局)、Content Collector Tools(内容收集工具)、Linked Content(关联内容)等等,简化多层内容的创建。

Adobe CS6全系列正式版发布 (Creative Suite 6终极设计套装)

Adobe Muse介绍:

Adobe Muse是一个刚宣布的全新工具,可以让设计师无需编写代码就能创建、发布HTML5 Web网站。

Flash Professional CS6介绍:

Flash Professional CS6用户可以使用CreateJS Flash专业工具包进行HTML5的翻译和转换,游戏体验的创建也大大增强,还能创建改进工作流和性能的Sprite Sheet。利用最新的Adobe Flash Player、AIR Runtimes,可以更轻松地开发Android、iOS设备应用。

Adobe CS6全系列正式版发布 (Creative Suite 6终极设计套装)

Dreamweaver CS6介绍:

Dreamweaver CS6用户无需再手动为手机、平板机、台式机分别单独创建基于CSS的界面,取而代之的是所谓的Fluid Grid Layouts,而借助直接整合的新服务PhoneGap Build,用户可为多个平台开发原生移动应用。

Adobe CS6全系列正式版发布 (Creative Suite 6终极设计套装)

Premiere Pro CS6介绍:

Premiere Pro CS6拥有更简洁高效的新式编辑环境,Adobe Mercury Playback Engine播放引擎也加入了对OpenCL、MacBook Pro的支持。

Adobe CS6全系列正式版发布 (Creative Suite 6终极设计套装)

After Effects CS6介绍:

After Effects CS6号称是该软件近十年来最大的一次进步,速度和响应度都更快,而且还有Global Performance Cache(全局性能缓存),可以即时保存预览,再大的对象也能随时应付。产品高级套装里新增了Adobe Prelude CS6、Adobe SpeedGrade,前者可以简化后期制作的工作流,而后者包含强大的后期修补工具,包括电影修补、调色等等。

Audition CS6介绍:

Audition CS6加速了音频的后期制作,比如简单快速匹配音频编辑的实时片段拉伸,以及引入强大的自动对话分析新引擎的自动语音组合(Automatic Speech Alignment)等等。

Adobe Mercury Transmit介绍:

Adobe Mercury Transmit是新的第三方硬件加速API,可以通过AJA、Blackmagic Design、Matrox等的第三方视频卡,为任何视频格式和编解码器提供更多实时特效。

Adobe CS6正式版价格:

价格方面,设计标准版、设计与网络高级版、产品高级版、大师典藏版四大套装分别要1299美元、1899美元、1899美元、2599美元,旧版升级价275美元、375美元、375美元、525美元。

Photoshop CS6、Photoshop CS6 Extended分别要699美元、999美元,旧版升级价199美元、399美元。如果按年度、月度订阅,则每月需要19.99美元、29.99美元——这是Adobe第一次引入订购模式,颠覆了以往的传统,堪称另一个“里程碑”。

Creative Cloud年度、月度订阅用户每月分别要49.99美元、74.99美元,CS3/4/5/5.5用户优惠价29.99美元每月。

Adobe CS6全系列产品和Creative Cloud云服务将于30天内全球上市,其中后者会出现在36个国家并支持多种语言。

Adobe CS6下载地址及破解补丁

Adobe Creative Suite 6四大套装:
Adobe Creative Suite 6 Design Standard (设计标准版):- 制作具有感染力的印刷设计和数字出版物,完整版价格:9248元
Windows版:http://trials2.stage.adobe.com/AdobeProducts/DSGN/CS6/win32/DesignStandard_CS6_LS3.7z
MAC版:http://trials2.stage.adobe.com/AdobeProducts/DSGN/CS6/osx10/DesignStandard_CS6_LS3.dmg
Adobe Creative Suite 6 Design & Web Premium (设计与网络高级版):- 为印刷、网络、平板电脑和智能手机提供创新理念,完整版价格:13516元
Windows版:http://trials2.stage.adobe.com/AdobeProducts/WEBB/CS6/win32/WebPremium_CS6_LS3.7z
MAC版:http://trials2.stage.adobe.com/AdobeProducts/WEBB/CS6/osx10/WebPremium_CS6_LS3.dmg
Adobe Creative Suite 6 Production Premium(产品高级版):完整版价格16895元。
Windows版:http://trials2.stage.adobe.com/AdobeProducts/STVD/CS6/win32/ProductionPremium_CS6_LS7.7z
MAC版:http://trials2.stage.adobe.com/AdobeProducts/STVD/CS6/osx10/ProductionPremium_CS6_LS7.dmg
Adobe Creative Suite 6 Master Collection(大师典藏版):完整版价格23120元。
Windows版:http://trials2.stage.adobe.com/AdobeProducts/STAM/CS6/win32/MasterCollection_CS6_LS3.7z
MAC版:http://trials2.stage.adobe.com/AdobeProducts/STAM/CS6/osx10/MasterCollection_CS6_LS3.dmg
Adobe Creative Suite 6独立程序:
Adobe After Effects CS6 – 自由发挥想象力,创建动态图像,完整版价格:8892元
Windows版:http://trials2.stage.adobe.com/AdobeProducts/AEFT/11/win64/AfterEffects_11_LS7.7z
MAC版:http://trials2.stage.adobe.com/AdobeProducts/AEFT/11/osx10-64/AfterEffects_11_LS7.dmg
Adobe Dreamweaver CS6 – 设计、开发和维护标准型网站和应用程序,完整版价格:2846元
Windows版:http://trials2.stage.adobe.com/AdobeProducts/DRWV/12/win32/Dreamweaver_12_LS3.exe
MAC版:http://trials2.stage.adobe.com/AdobeProducts/DRWV/12/osx10/Dreamweaver_12_LS3.dmg
Adobe Fireworks CS6 – 弹指间就能设计最精美的网站和移动应用程序,完整版价格:2135元
Windows版:http://trials2.stage.adobe.com/AdobeProducts/FWKS/12/win32/Fireworks_12_LS3.exe
MAC版:http://trials2.stage.adobe.com/AdobeProducts/FWKS/12/osx10/Fireworks_12_LS3.dmg
Adobe Flash Professional CS6 – 在设备中创建并发布丰富多彩的创意,完整版价格:4980元
Windows版:http://trials2.stage.adobe.com/AdobeProducts/FLPR/12/win32/FlashPro_12_LS3.exe
MAC版:http://trials2.stage.adobe.com/AdobeProducts/FLPR/12/osx10/FlashPro_12_LS3.dmg
Adobe Illustrator CS6 – 使用基本的矢量工具探索新途径,完整版价格:4269元
Windows版:http://trials2.stage.adobe.com/AdobeProducts/ILST/16/win32/Illustrator_16_LS3.7z
MAC版:http://trials2.stage.adobe.com/AdobeProducts/ILST/16/osx10/Illustrator_16_LS3.dmg
Adobe InDesign CS6 – 为印刷和数字出版设计专业页面版面,完整版价格:4980元
Windows版:http://trials2.stage.adobe.com/AdobeProducts/IDSN/8/win32/InDesign_8_LS3.7z
MAC版:http://trials2.stage.adobe.com/AdobeProducts/IDSN/8/osx10/InDesign_8_LS3.dmg
Adobe Photoshop CS6 – 运用专业级标准创作出具有震撼力的图像,完整版价格:4980元
Windows版:http://trials2.stage.adobe.com/AdobeProducts/PHSP/13/win32/Photoshop_13_LS3.7z
MAC版:http://trials2.stage.adobe.com/AdobeProducts/PHSP/13/osx10/Photoshop_13_LS3.dmg
Adobe Premiere Pro CS6 – 预订购按您需要的方式编辑,完整版价格:7114元
Windows版:http://trials2.stage.adobe.com/AdobeProducts/PPRO/6/win32/PremierePro_6_LS7.7z
MAC版:http://trials2.stage.adobe.com/AdobeProducts/PPRO/6/osx10/PremierePro_6_LS7.dmg

全系列激活补丁下载
http://dl.dbank.com/c0pbgmblxo

Web前端开发必备手册

收藏各种Web前端开发必备手册

HTML速查手册

  1. HTML速查手册 [直接下载](英文)
  2. HTML5 速查手册 [直接下载](英文)
  3. HTML5 中文速查手册 [直接下载]
  4. HTML字符实体速查手册 [直接下载](英文)
  5. RGB十六进制手册 [直接下载](英文)
  6. 微格式速查手册 [直接下载](英文)

CSS速查手册

  1. CSS 速查手册 (V2) [直接下载](英文)
  2. CSS3 速查手册 [直接下载](英文)
  3. CSS2.0手册 [直接下载](苏沈小雨中文版)
  4. CSS3.0参考手册 [直接下载](中文版)

 

javascript速查手册

  1. javascript速查手册 [直接下载](英文)
  2. javascript DOM 速查手册 [直接下载](英文)
  3. 正则表达式速查手册V2 [直接下载](英文)
  4. jQuery Visual Map(英文)
  5. mootools 1.2 速查手册 [直接下载](英文)
  6. Prototype 1.6.0.2 速查手册 [直接下载](英文)
  7. jQuery api 参考文档 [离线版下载] [1.3中文版]
  8. jQuery 1.7 API 中文版[在线] 离线版下载 [1.7中文版]
  9. jQuery 中文API[在线]

有道身份证查询接口API

有道身份证号API查询接口

接口地址:http://www.youdao.com/smartresult-xml/search.s?type=id&q=身份证号
参数说明:

  • q : 要查询的身份证

返回XML数据:

<?xml version="1.0" encoding="gbk"?>
<smartresult>
<product type="identitycard">
<code>370782196402121133</code>
<location>山东省潍坊市诸城市</location>
<birthday>19640212</birthday>
<gender>m</gender>
</product>
</smartresult>

或者

http://www.youdao.com/smartresult-xml/search.s?jsFlag=true&type=id&q=身份证号
返回JSON数据:

updateCall(1, {‘product’:’identitycard’,’code’:’321528198807303319′,’location’:’湖北省宜昌市长阳土家族自治县’,’birthday’:’19880730′,’gender’:’m’} , ”);