jQuery: последовательность анимации страницы-заставки, заканчивающаяся переходом URL - PullRequest
0 голосов
/ 01 ноября 2011

Я создаю простую заставку со следующей последовательностью:

  1. Исчезают элементы
  2. Подождите 5 секунд
  3. Затухающие элементы
  4. Запустить новую страницу

Я могу получить шаги с 1 по 3 для правильной работы в последовательности.

Однако, как только я добавляю перенаправление URL в свою цепочку (шаг 4), он быстро выполняет шаги с 1 по 3 и прыгает. Вот код, который я использую:

<html>
<head>
<style type="text/css">
.splash p { background: yellow; display: none; }
</style>
<script type="text/javascript" src="jquery-1.6.4.min.js"></script>
<script type="text/javascript">
$.fn.go_homebase = function() {
    var url = "homebase.html";
    $(location).attr('href',url);
}

$(document).ready(function() {
    $('.splash p').fadeIn('slow').delay(5000).fadeOut('slow').go_homebase();
});
</script>
</head>
<body class="splash">
<p>Splash Page!</p>
</body>
</html>

Есть ли правильный и лучший способ, которым я должен это делать?

Ответы [ 3 ]

1 голос
/ 06 января 2012

Это прекрасно работает для меня.

$(document).ready(function() {
    $('.splash p').fadeIn(1500).delay(5000).fadeOut(2000,
        function() { window.location = "http://google.com"; });
});
1 голос
/ 01 ноября 2011

Вы должны позвонить go_homebase при полном обратном вызове fadeOut, например ::100100

$('.splash p').fadeIn('slow').delay(5000).fadeOut('slow', function() { $(this).go_homebase(); });
0 голосов
/ 01 ноября 2011

Это должно сработать:

$('.splash p').fadeIn('slow').delay(5000).fadeOut('slow', 
  function(){ $(this).go_homebase()}
);

Вам нужно вызвать функцию перенаправления в качестве обратного вызова, когда закончится последняя анимация.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...