задержка jQuery ссылка от того, чтобы быть сопровождаемым
У меня есть короткая основанная на CSS анимация, которую я хочу закончить, прежде чем по ссылке переходят (карта, которая напала в на налеты загрузки страницы после щелчка). В настоящее время, однако, страница назвала загрузки слишком быстро. Я хочу смочь кратко задержать href от того, чтобы быть сопровождаемым.
Вот то, что я имею:
$(document).ready(function() {
$("#card").css("top","0px");
$(".clickit").click(function() {
$("#card").css("top","-500");
});
});
Первая строка нападает карта в на загрузку страницы. После этого вызов щелчка, который изменяет CSS, но как я сказал там, что потребности быть некоторой задержкой там, потому что страница сразу загружается, вместо после анимации. CSS, который изменяется, похож на это:
#card {
width: 400px;
height: 500px;
position: relative;
top: -500px;
-webkit-transition:all .5s;
}
(да, я знаю, что это только для WebKit прямо сейчас),
Это - проблема, очень похожая на этот вопрос с 2008, но я знаю, что jQuery был обновлен значительно с тех пор, таким образом, я хотел видеть, было ли более современное решение.
Спасибо!
2 ответа
Поскольку вы используете .css() и -webkit-transition:, вам нужно использовать setTimeout() для задержки нового расположения.
Попробуйте живой пример: http://jsfiddle.net/2WJH9/
$(document).ready(function() {
$("#card").css("top","0px");
$(".clickit").click(function() {
$("#card").css("top","-500px"); // Added px to make it work,
// or get rid of quotes -500
var href = $(this).attr('href');
// Delay setting the location for one second
setTimeout(function() {window.location = href}, 1000);
return false;
});
});
setTimeout() задержит установку window.location на 1 секунду (1,000 миллисекунд). Если вы хотите, чтобы .5 секунд от -webkit-transition:, то измените его на 500.
.setTimeout()- http://www.w3schools.com/js/js_timing.asp
Это проблема, очень похожая на вопрос 2008 года, но я знаю, что с тех пор jQuery значительно обновился, поэтому я хотел посмотреть, есть ли более современное решение.
Нет, все тот же ответ. Отмените мероприятие, а затем загрузите местоположение самостоятельно.