Показать сообщение отдельно
  #1 (permalink)  
Старый 29.05.2012, 13:16
Новичок на форуме
Отправить личное сообщение для caca0 Посмотреть профиль Найти все сообщения от caca0
 
Регистрация: 18.05.2012
Сообщений: 7

Как установить задержку внутри цикла for - ?
Функция пеемещает квадратик (div#test) по экрану из левого верхнего угла в правый нижний.
Попробова добавить интервал - задержку перед перемещением - не получается. Консоль ругается - "Operation is not supported
var elemWidth = window.getComputedStyle(elem,null).getPropertyValu e('width');"
В чем может быть дело?

<!DOCTYPE HTML>
<html lang="en-US">
<head>
    <meta charset="UTF-8">
    <title>Test Page</title>
    <link rel="stylesheet" href="css/reset.css">
    <style type="text/css">
        #test {
            display: block;
            width: 50px;
            height: 50px;
            position: absolute;
            top: 0;
            left: 0;
            background-color: red;
        }
    </style>
</head>
<body>
<div id="test">

</div>
<script type="text/javascript">

function moveObject(element) {
        var screenWidth = window.innerWidth;
        var screenHeight = window.innerHeight;
        var elem = document.getElementById(element);
        var elemWidth = window.getComputedStyle(elem,null).getPropertyValue('width');
        elemWidth = parseInt(elemWidth);
        var elemHeight = window.getComputedStyle(elem,null).getPropertyValue('height');
        elemHeight = parseInt(elemHeight);
        var top = window.getComputedStyle(elem,null).getPropertyValue('top');
        top = parseInt(top);
        var left = window.getComputedStyle(elem,null).getPropertyValue('left');
        left = parseInt(left);
        var count = 1;
        var timeout = setTimeout(arguments.callee, 2000);
        for(top,count; top <= screenHeight - elemHeight; top = top + elemHeight,count++) {
            if(!count % 2 == 0) {
                for(left; left <= screenWidth - elemWidth; left = left + elemWidth) {
                    elem.style.left = left + 'px';
                    console.log(elem.style.left + '/');
                    timeout;
                }
            }
            if(count % 2 == 0) {
                for(left; left >= elemWidth; left = left - elemWidth) {
                    elem.style.left = left + 'px';
                    console.log(elem.style.left + '//');
                    timeout;
                }
            }
            console.log(elem.style.top + '///');
            elem.style.top = top + 'px';
            timeout;
        }
    }

moveObject('test');

</script>
</body>
</html>
Ответить с цитированием