Показать заставку один раз за сеанс с JQuery ... домашняя страница «мигание» во время загрузки

Question

Показать заставку один раз за сеанс с JQuery ... домашняя страница «мигание» во время загрузки

голоса

42

Я пытаюсь сделать экран интро / Всплеск появляется только один раз за сессию на моей домашней странице. У меня есть его работа со скриптом ниже, но она «вспышка» на главной странице быстро перед запуском заставки / интро на начальной загрузке сайта (последующие нагрузки сайта не показывать DIV, как хотеться / нужно)

У меня есть DIV с классом .splash_section скрытомом изначально и я бегом сценария включенного ниже.

Вопрос: Есть ли лучший способ, чтобы написать сценарий, или просто способ предотвратить домашнюю или тело от быстро «мигания» перед интро шоу?

$(document).ready(function(){

if (sessionStorage.getItem('splash') !== 'true') {
$('.splash_section').show()
sessionStorage.setItem('splash','true');
}

});

Спасибо за любую помощь заранее.

jquery html

Задан 21/11/2015 в 02:01
пользователем Brandon Vaughn

На других языках...

2 ответов

голоса

0

Поскольку $(document).readyобратный вызов срабатывает , когда все элементы страницы обрабатывается, лучше всего, чтобы поместить элемент заставки на самом верху тела и запустить скрипт с этой функцией сразу после него. Таким образом , она будет загружать метаданные из головы, загрузите содержимое заставки и отображать его сразу до загрузки любых других элементов DOM.

Что-то вроде этого:

<body>
    <div class="splash_section"></div>
    <script>
    if (sessionStorage.getItem('splash') !== 'true') {
        $('.splash_section').show()
        sessionStorage.setItem('splash','true');
    }
    </script>
    ...

Ответил 21/11/2015 в 02:13
источник пользователем Shomz

Vince · Accepted Answer · 2015-11-21 02:11

Я также хотел бы скрыть содержимое главной страницы на начальном этапе, с помощью CSS:

.home-page {
    display: none;
}

Затем измените сценарий для:

$(document).ready(function(){

    if (sessionStorage.getItem('splash') !== 'true') {
        $('.splash_section').show();
        sessionStorage.setItem('splash','true');
    }
    else {
        $('.home-page').fadeIn();
    }    
});