TinyAnimate风格多样的 JS 动画库
TinyAnimate 一款轻量级的,风格多样的,采用JavaScript编写的动画库。
设置CSS样式:
var square = document.querySelector('.square'); TinyAnimate.animateCSS(square, 'marginLeft', 'px', 10, 70, 500, 'easeInOutQuart', function() { console.log('done!!!111oneone'); });
“X”属性在SVG元素中的应用:
var square = document.querySelector('.square'); TinyAnimate.animate(70, 10, 1000, function(x) { square.setAttribute('x', x); });
使用Require.js改变透明度:
define(['TinyAnimate'], function(TinyAnimate) { var elem = document.querySelector('button.send'); elem.addEventListener('click', function(e) { TinyAnimate.animate(1, .5, 500, function(opacity) { square.style.backgroundColor = 'rgba(65, 131, 196, ' + opacity + ')'; }); }); });
评论