Задержка функции на время перехода

Question

Как сделать задержку этого скрипта на 350 миллисекунд в ожидании завершения перехода css3?

    <script type="text/javascript">
        $(document).ready(function() {
            var last = "";
            $("#thumbs a").click(function() {
                event.preventDefault();
                var graphic = $(this).attr("href");
                if(last != graphic) {
                    $("#placeholder").before( "<img src=\"" + graphic + "\" />" );
                    $("#mask").css("marginTop","-=450px");
                    last = graphic;
                }
            });
        });
    </script>

Обычно, когда вы щелкаете, он должен проверить, был ли он нажат в течение последних 350 миллисекунд, и, если это так, ничего не делать.

Я слышал о функции transitionend, но я не мог понять, как ее реализовать.

Answer 1

После document.ready заключите ваш код в функцию.Возможно "function wait () {... code here ...}, затем используйте settimeout, например, var t = setTimeout (wait, 350);

Надеюсь, это поможет. Если нет, попробуйте добавить загрузкуобработчик вашего объекта CSS-перехода, затем поместив функцию setTimeout в функцию обратного вызова load.Он должен дождаться загрузки объекта и установить таймер для запуска вашей функции через 350 миллисекунд после загрузки объекта.

Answer 2

Я бы сделал что-то вроде этого:

var clickable = true;
var timer;
$('#thumbs a').click(function(event){
    event.preventDefault();
    if(clickable){
      do stuff!
    }else{
        clearTimeout(timer);
    }
    clickable = false;        
    timer = setTimeout(function(){
        clickable = true;
    }, 350);

});