Как повторить функцию onclick - Javascript - PullRequest
Новая
       8

Как повторить функцию onclick - Javascript

0 голосов
/ 19 февраля 2012

Итак, я пытаюсь сделать анимацию в JavaScript (я хочу, чтобы панель навигации опускалась при нажатии на нее). Проблема в том, что каждый раз, когда я нажимаю на эту панель навигации, она перемещается только на один пиксель вниз. Как сделать так, чтобы я мог повторять функцию «Переместить» снова и снова, чтобы она понимала, что панель навигации находится ниже «0», и перемещал ее вверх? Вот код, который я имею atm: 

var i = -43 //original position of div

    function Move(x)
{
    if (i < 0)
    {
        i++;
        x.style.top = i + "px";
    }

}


function setPosition(x)
{
    setInterval(Move(x), 500);
}

P.S. У меня "div onclick", равный "setInterval (this)"

1 Ответ

0 голосов
/ 19 февраля 2012

Я бы использовал setTimeout() (чтобы вам не пришлось беспокоиться об отмене setInterval()), и обратите внимание на использование анонимной функции (function(){}) для первого аргумента вызова setTimeout() : 

#slider {
    position: absolute;
    top: -43px;
    left: 200px;
    width: 200px;
    height: 50px;
    border: 1px solid blue;
    background: #dff;
}

<div id='slider'>This is a slidout</div>
<div id="clicker">Click me!</div>

var slider = document.getElementById('slider'),
    clicker = document.getElementById('clicker');

clicker.onclick = function(){
    Move(slider, -43);
};

function Move(x, i)
{
    if (i < 0)
    {
        i++;
        x.style.top = i + "px";

        setTimeout(function(){
            Move(x, i);
        }, 50);
    }
}

http://jsfiddle.net/h2C3A/

...