Question

我是JavaScript新手，刚开始学习窗口方法。我想写这个方法来获得一个新窗口，从屏幕的左端移动到右端。但是，代码不起作用。

有人可以告诉我哪里出错了。

    <!doctype html>
<html>
<title>Avoid Window</title>
<head>
<script type="text/javascript">
    var MovingWindow;   

    function CreateWindow()
    {
        MovingWindow = window.open('','MovingWindow','width=100,height=100,menubar=0,toolbar=0,location=0,resizeable=0,status=0');
        window.MovingWindow.moveTo(0,0);
        while( window.MovingWindow.screenX < window.screen.width - window.MovingWindow.width)
        {

            window.MovingWindow.moveBy(1,0);
        }

    }
</script>
</head>
<body>
<h1>Avoid Window</h1>
<p> Click on the button below to create a window which moves from one end of the screen to the other end of the screen</p>
<input type="Button" onClick="CreateWindow();" value="Create Window"/>
<input type="Button" onClick="MoveWindow();" value="Move Window"/>
</body>
</html>

Answer 1

你不能在循环中做动画。只要该功能正在运行，用户界面就不会更新。您的函数将更改窗口的坐标，当函数结束时，窗口将在最终位置重绘。

使用window.setInterval方法启动可以移动窗口的间隔：

var timer = window.setInterval(function(){
  if (window.MovingWindow.screenX < window.screen.width - window.MovingWindow.width) {
    window.MovingWindow.moveBy(1,0);
  } else {
    window.clearInterval(timer);
  }
}, 100);

但是，正如Daniel A.所指出的，某些浏览器不允许客户端脚本移动窗口。如果它在您的浏览器中不起作用，您可以更改设置，以测试setInterval方法是否有效。

为什么这个JavaScript代码没有为窗口设置动画？

1 个答案: