//創(chuàng)建簡(jiǎn)單的動(dòng)畫函數(shù)封裝效果(目標(biāo)對(duì)象，目標(biāo)位置) function animate(obj,target){var id = setInterval(function(){if(obj.offsetLeft >= target){clearInterval(id);}else{obj.style.left = obj.offsetLeft + 5 + 'px';}},30) }

可以實(shí)現(xiàn)如下效果：

<div></div><span></span> <style>div{width: 100px;height: 100px;background-color: red;position: absolute;top: 0;left: 0;}span{display: block;width: 50px;height: 50px;background-color: gold;margin-top: 200px;position: absolute;top: 0;left: 0;}</style> // 創(chuàng)建簡(jiǎn)單的動(dòng)畫函數(shù)封裝效果(目標(biāo)對(duì)象，目標(biāo)位置)function animate(obj,target){var id = setInterval(function(){if(obj.offsetLeft >= target){obj.offsetLeft = target;clearInterval(id);}else{obj.style.left = obj.offsetLeft + 5 + 'px';}},30)}var div = document.querySelector('div');var span = document.querySelector('span');animate(div,300);animate(span,300);

總結(jié)

以上是生活随笔為你收集整理的简单的动画函数封装（1）的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。