JQUERY оживить Задержка?

Question

Я использую JQUERY animate для показа баннера в верхней части страницы, который представляет собой DIV, для которого установлено значение top -60, чтобы скрыть его. Я использую следующий вызов JS, чтобы показать div:

// Animation
$('#message-dock').animate({
    top: 0
}, 500, function() {
    // Animation complete.
});

Что я не могу понять, так это по какой-то причине нежелательная задержка, прежде чем я начну видеть div, и я не могу понять, почему? Есть идеи?

Answer 1

Почему бы просто не установить css для div на display:none;, а затем использовать $("#message-dock").show('slow');, когда вы хотите показать это?Работает без «медленно» или с «быстро» тоже.

Answer 2

Я согласен со Скоттом, ваша задержка связана с тем, когда запускается скрипт. Если вы не ждете состояния готовности, я бы поместил скрипт прямо под элемент html # message-dock; Однако, если вы попытаетесь анимировать во время работы других скриптов, это не будет чистой анимацией. Используйте CDN для загрузки jquery.js http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js поместите jquery.js перед сценарием, который анимирует # message-dock ... это приведет к загрузке jquery до html, поэтому сеть доставки контента (CDN) является лучшей путь

Что может случиться, когда запускаются другие сценарии: анимация начинается до того, как все остальное загрузится ... запускается другой сценарий, который занимает несколько секунд, пока он не заканчивает блокировку анимации, чтобы быть гладкой ... анимация проверяет, как далеко вниз определяет вершину в нуле и отображает ее без какой-либо анимации - только задержанное появление.

Чтобы получить представление о том, как загружается ваша страница, вы можете использовать http://www.webpagetest.org/