<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<style type="text/css">
img{
position: absolute;
top: 0;
left: 0;
}
</style>
</head>
<body>
<img src="imgs/snow.gif" id="snow">
<script type="text/javascript">
var img = document.getElementById('snow');
//1.无脑写缓动动画公式
var leaderX = 0, leaderY = 0;
var targetX = 0, targetY = 0;
setInterval(function(){
leaderX = leaderX + (targetX - leaderX) / 10;
leaderY = leaderY + (targetY - leaderY) / 10;
img.style.left = leaderX + 'px';
img.style.top = leaderY + 'px';
}, 10);
//2.给document注册onclick
document.onclick = function(event){
// alert('11');
var evt = event || window.event;
targetX = evt.clientX - img.offsetWidth / 2;
targetY = evt.clientY - img.offsetHeight / 2;
}
</script>
</body>
</html>