请求动画帧开始CSS转换是否有意义?
例如,Mozilla CSS转换页面包含指向此jsfiddle示例的链接:
CSS:
#foo{
border-radius:50px;
width:50px;
height:50px;
background:#c00;
position:absolute;
top:0;
left:0;
-moz-transition: all 1s;
-webkit-transition: all 1s;
-ms-transition: all 1s;
-o-transition: all 1s;
transition: all 1s;
}
Run Code Online (Sandbox Code Playgroud)
JavaScript的:
var f = document.getElementById('foo');
document.addEventListener('click', function(ev){
f.style.left = (ev.clientX-25)+'px';
f.style.top = (ev.clientY-25)+'px';
},false);
Run Code Online (Sandbox Code Playgroud)
重写这个例子如下有意义吗?(见这个jsfiddle)
JavaScript的:
var rAF = window.mozRequestAnimationFrame ||
window.webkitRequestAnimationFrame;
var f = document.getElementById('foo');
document.addEventListener('click', function(ev){
rAF(function() {
f.style.left = (ev.clientX-25)+'px';
f.style.top = (ev.clientY-25)+'px';
});
},false);
Run Code Online (Sandbox Code Playgroud)
谢谢你的回答.