Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Проблема с таймаутом... (https://javascript.ru/forum/dom-window/25491-problema-s-tajjmautom.html)

Adm123 07.02.2012 09:24

Проблема с таймаутом...
 
Уважаемые форумчане, помогите, плз! Никак не пойму в чем проблема...

Я хочу, чтоб по клику мышки некий блок плавно переезжал с одного места на другое...

Вот код JS:
function MoveBlock(BlockID)
{
Block = document.getElementById(BlockID);
step = 10;
marg = parseInt(Block.style.marginLeft.replace("px", ""));
marg = marg+step;
if (marg < 300)
{
Block.style.marginLeft = marg + "px";
setTimeout(MoveBlock(BlockID), 1000);
}
}


И хтмл:
<div id="myblock" onClick="MoveMenu('myblock');" style="z-index: 2000; position: absolute; margin-left: 50px; left: 50px; top: 50px; width: 100px; height: 200px; background-color: #808080;">df</div>


Но при клике по нужному div-у он резко прыгает сразу на конечную позицию, плавного перемещения не происходит... :-E

poorking 07.02.2012 09:40

Посмотрите, в setTimeout надо передавать Function, а ваш MoveBlock возвращает неявно undefined. Держу пари что вы хотели написать

setTimeout(function () {
    MoveBlock(BlockID);  // Замыкание
}, 1000)

Adm123 07.02.2012 11:11

О, чудо! Спасибо, poorking!
Хотя, признаться, я не понял почему оно заработало... :blink:

poorking 07.02.2012 11:19

Потому что метод window.setTimeout принимает первым аргументом функцию, а вы предавали ее результат (и это не Function), если бы ваш Function MoveBlock не нужнался в аргументах, то вы бы написали просто

setTimeout(MoveBlock, 1000)

, но ему нужен аргумент поэтому пришлось замкнуть внутри анонимной функции-обертки ваш метод MoveBlock и его аргумент BlockID

function () {
    MoveBlock(BlockID);
}


и передали ее setTimeout-у

Читать

Замыкания
setTimeout
setInterval
Основы программной анимации на Javascript

Adm123 07.02.2012 11:51

Теперь понял. Спасибо за помощь и разъяснения!


Часовой пояс GMT +3, время: 17:27.