Émile是一个独立的CSS animation JavaScript 小框架。
- 不需要JavaScript框架
- 完整的CSS animation属性
- 简单易用
- 代码少于50行
针对的平台:
- Microsoft Internet Explorer for Windows, version 6.0 and higher
- Mozilla Firefox 1.5 and higher
- Apple Safari 2.0.4 and higher
- Opera 9.25 and higher
- Chrome 1.0 and higher
点击查看示例:
Html代码

- <script src="emile.js"></script>
-
- <div id="test1" style="position:absolute;left:0px;background:#f00;opacity:0">test</div>
- <div id="test2" style="border:0px solid #00ff00;position:absolute;left:0px;top:400px;background:#0f0">test</div>
-
- <script>
- emile('test2', 'left:300px;padding:10px;border:50px solid #ff0000', {
- duration: 500,
- after: function(){
- emile('test1', 'background:#0f0;left:100px;padding-bottom:100px;opacity:1', {
- duration: 4000, easing: bounce
- });
- }
- });
-
- function bounce(pos) {
- if (pos <(1/2.75)) {
- return (7.5625*pos*pos);
- } else if (pos <(2/2.75)) {
- return (7.5625*(pos-=(1.5/2.75))*pos + .75);
- } else if (pos <(2.5/2.75)) {
- return (7.5625*(pos-=(2.25/2.75))*pos + .9375);
- } else {
- return (7.5625*(pos-=(2.625/2.75))*pos + .984375);
- }
- }
- </script>