запустить gif, затем скрыть предварительный загрузчик

Question

Любая помощь здесь будет очень признательна.

Я создаю сайт портфолио, где я хотел бы включить короткий сценарий предварительного загрузчика jquery, чтобы отобразить белый экран наложения - вместе с центрированной анимацией .gif - в течение нескольких секунд, прежде чем исчезнуть из gif, затем наложение для отображения главной страницы.

Сценарий я работаю с в настоящее время выглядит следующим образом:

jQuery(window).load(function() { // makes sure the whole site is loaded 
jQuery("#status").fadeOut("slow"); // will first fade out the loading animation 
jQuery("#preloader").delay(400).fadeOut("slow"); // will fade out the white DIV that  
covers the website. 
}) 

Я могу добавить функцию SetTimeout и задержать загрузчиком FadeOut в течение нескольких секунд, но когда я делаю так .gif, упомянутые в #status не отображается. Мой вопрос: как мне связать setTimeout с этими двумя событиями, чтобы при готовности страницы .gif разрешалось работать в течение 3 секунд, затем исчезать и, наконец, прелоадер исчезает.

Надеюсь, что имеет смысл. Дайте мне знать, если у вас возникнут дополнительные вопросы. Сайт в настоящее время находится на локальном dev-сервере, но при необходимости я могу сделать снимок экрана.

P

Answer 1

Я думаю, что-то вроде этого является то, что вы ищете:

http://jsfiddle.net/yG2fH/

$(document).ready(function() { 
    setTimeout(function() { 
     $('#status').fadeOut('slow', function() { 
      $('#preloader').fadeOut('slow'); 
     }); 
    }, 3000); 
}); 

fadeOut имеет перегрузку с двумя параметрами: сначала длительность, затем функцию после завершения анимации.