0

我编写了这些代码并使其在 IE&chrome&firefox 中运行,它在 chrome 和 firefox 中运行良好,但在 IE 中出错。有人告诉我为什么,谢谢!

这些代码在我按下开始按钮时会产生动画,我希望当我按下停止按钮时它会停止,但是当我按下停止时,警报会显示很多次。

好的,这是我的代码。小心你的浏览器,播放动画时可能会崩溃。

原谅我英语不好

<html style = "overflow:hidden">
<script src="jquery-1.7.2.js"></script>
<script>
var DIV ;
var CONTENT ;
var move = false;
$(function(){
    DIV = $('<img src="7.png"></img>');
    CONTENT = $('#content');
});
function startAnimation(){
    $('#content').empty();
    var div = $('<img src="7.png"></img>');
    div.appendTo('#content');

    var w_w=$(document).width();
    var d_w=div.width();
    var l=w_w/2 - d_w/2; 

    div.css("position","absolute");
    div.css("top",$(document).height()+div.height());
    div.css("left",l);

    if(!move){
        div.animate({top:-div.height(),left:l},1000,function(){
            alert('ok');
            return;
        });
    }else{
        div.animate({top:-div.height(),left:l},1000,function(){
        //setTimeout(function(){
            startAnimation.call(window);
            return;
        });
    }
}
function start(){
    if(!move){
        move = true;
        startAnimation();
    }
}
function stop(){
    move = false;
}
</script>
<body  style = "overflow:hidden">
<button onclick="start();">start</button>
<button onclick="stop();">stop</button>
<div id='content' sytle="width:1000px;height:700px;overflow:hidden">

</div>
</body>
</html>
4

1 回答 1

0

某些 Internet Explorer 版本会忽略 css 值;没有px在它的末尾。

top:200返回错误,但top:200px在 ie 上工作正常。

试试这个:

if(!move){
   div.animate({'top':-div.height()+'px','left':l + 'px'},1000,function(){//here
        alert('ok');
        return;
   });
}else{
   div.animate({'top':-div.height()+'px','left':l + 'px'},1000,function(){//+'px'
        startAnimation.call(window);
        return;
   });
}
于 2012-08-08T08:39:55.357 回答