カプセル化されたモーション フレームワーク Move(obj,attr,iTarget) は直接呼び出すことができます:
幅、境界線、fontSize、marginLeft、不透明度などの多くの一般的な属性値の可変速度変更を設定して、さまざまな興味深い効果を実現するために使用できます。
IEおよびFFと互換性があります。
function Move(obj,attr,iTarget){
clearInterval(obj.timer);//Close the previous timer to solve the problem of timer failure when calling multiple Move() on the same object at the same time Overlay problem. Use obj.timer to give each object that calls Move() its own timer to prevent multiple objects from using the same timer when calling Move() at the same time, causing related interference problems.
obj.timer=setInterval(function(){
var cur=0;//Create a variable to store the value of the attr attribute at each moment
if(attr=="opacity") {
use using using using using opacity using FF. round (parseFloat(getStyle(obj,attr))*100); etc.) into an integer
}
var speed=(iTarget-cur)/10;//Create a decreasing speed speed variable to realize variable speed changes of attribute values
.
Speed=speed>0?Math.ceil(speed):Math.floor(speed);//Rounding to solve the problem that the browser ignores values less than 1px and causes the end of the movement to be a few pixels short of the target value Itarget Question
if(attr=="opacity"){
// Set the opacity attribute value for IE and FF respectively obj.style.filter="alpha(opacity: " cur ")"; //for IE
. Add a value to the specified attribute attr cur speed
The value of the attribute in . obj: element object. name: attribute name.
function getStyle(obj,name){
if(obj.currentStyle){
return obj.currentStyle[name];//for IE
}else{
return getComputedStyle(obj, false)[name];//for FF
}
}