我有一个可以在IE和Chrome中运行但不在FF中运行的脚本..或者如果我不知道'x'被警告的行,它可以在所有三个中运行吗?
在FF 3.6中,当脚本完成一半时div首先可见..它只是跳到“移动线”的中间
<div id="tst" style="position:absolute; top:200px; left:200px; height:100px; width:100px; background:#ff0000"></div>
<script type="text/javascript">
function Tween(){
this.time = 0;
this.duration = 800;
this.x_start = 0;
this.x_end = 0;
this.target_func = null;
this.method_func = null;
this.loop = null;
this.interval = 20;
this.start = function(){
if(!this.method_func){
this.method_func = this.regularEaseOut;
}
var _this = this;
this.loop = setInterval(function(){
if(_this.set_time() > 0){
var x = _this.method_func();
//alert(x);
_this.target_func(x);
}
}, this.interval);
};
this.set_time = function(){
this.time += this.interval;
if(this.time > this.duration){
clearInterval(this.loop);
this.time = 0;
}
return this.time;
};
this.regularEaseInOut = function(){
var t = this.time;
var s = this.x_start;
var e = this.x_end;
var d = this.duration;
if((t/=d/2) < 1){
return c/2*t*t + b;
}
else{
return -c/2 * ((--t)*(t-2) - 1) + b;
}
};
this.regularEaseIn = function(){
var t = this.time;
var s = this.x_start;
var e = this.x_end;
var d = this.duration;
return c*(t/=d)*t + b;
};
this.regularEaseOut = function(){
var t = this.time;
var s = this.x_start;
var e = this.x_end;
var d = this.duration;
return -e *(t/=d)*(t-2) + s;
};
}
var Tween = new Tween();
Tween.x_start = 200;
Tween.x_end = 1200;
Tween.target_func = function(x){
document.getElementById('tst').style.left = x+'px';
};
Tween.start();
</script>
答案 0 :(得分:1)
这有效:
<html>
<head>
<script type="text/javascript">
function Tween(){
this.time = 0;
this.duration = 800;
this.x_start = 0;
this.x_end = 0;
this.target_func = null;
this.method_func = null;
this.loop = null;
this.interval = 20;
this.start = function(){
if(!this.method_func){
this.method_func = this.regularEaseOut;
}
var _this = this;
this.loop = setInterval(function(){
if(_this.set_time() > 0){
var x = _this.method_func();
//alert(x);
_this.target_func(x);
}
}, this.interval);
};
this.set_time = function(){
this.time += this.interval;
if(this.time > this.duration){
clearInterval(this.loop);
this.time = 0;
}
return this.time;
};
this.regularEaseInOut = function(){
var t = this.time;
var s = this.x_start;
var e = this.x_end;
var d = this.duration;
if((t/=d/2) < 1){
return c/2*t*t + b;
}
else{
return -c/2 * ((--t)*(t-2) - 1) + b;
}
};
this.regularEaseIn = function(){
var t = this.time;
var s = this.x_start;
var e = this.x_end;
var d = this.duration;
return c*(t/=d)*t + b;
};
this.regularEaseOut = function(){
var t = this.time;
var s = this.x_start;
var e = this.x_end;
var d = this.duration;
return -e *(t/=d)*(t-2) + s;
};
}
function doYourThing() {
var tween = new Tween();
tween.x_start = 200;
tween.x_end = 1200;
tween.target_func = function(x){
document.getElementById('tst').style.left = x+'px';
};
tween.start();
}
</script>
</head>
<body onload="doYourThing()">
<div id="tst" style="position:absolute; top:200px; left:200px; height:100px; width:100px; background:#ff0000"></div>
</body>
</html>
因此,使用onload可确保仅在加载文档后运行该方法。此外,您创建了一个实例变量(Tween),其名称与要实例化的“类”相同。这肯定会让你在路上感到痛苦和痛苦。
答案 1 :(得分:0)
alert
停止执行代码,直到按下Ok
。检查这是否是您问题的根源。
答案 2 :(得分:0)
这意味着什么不起作用?
如果你的意思是它没有向右移动,它在我的FF 4.0.1中适用于我