Как вывести всплывающее окно при скроле только один раз?

Question

[Александр Пунченко]

Есть скрипт который выводит всплывающее окно при скроле страницы и есть кнопка чтобы это окно можно было закрыть.

<script type="text/javascript">
$(document).ready(function(){
    $(window).scroll(function(){
        if($(window).scrollTop()>120){
            $('#top').fadeIn(900)
        }else{
            $('#top').fadeOut(700)
        }
    });
});
</script>

Проблема в том, что после закрытия и дальнейшего скролла окно появляется снова, подскажите как реализовать работу этого скрипта только один раз за посещение страницы. Нашел инфу, что можно сделать через метод .one(), попробовал сам, но не получилось. Надеюсь на вашу помощь )

Answer 1

[Александр]

Добавьте на кнопку закрытия pop-up след. код.

$(window).off('scroll');

И если у вас есть еще другие события на scroll, то нужно сделать след.

function myScrollFunction(){
        if($(window).scrollTop()>120){
            $('#top').fadeIn(900)
        }else{
            $('#top').fadeOut(700)
        }
    }

/////

$(window).scroll(myScrollFunction);

////

$(window).off('scroll', myScrollFunction);

Comments

[Александр Пунченко]

Спасибо большое за Ваш ответ! Но совсем слабо знаю js и видимо что-то не правильно делаю.

Попробовал вот так, но не получилось.

<script type="text/javascript">
$(document).ready(function(){
    $('#close').click( function(){  
            $(window).off('scroll');
        }
    );
});
</script>

[Александр Пунченко]

Вот так выглядит сам код блока с кнопкой

<div id="top">
<div id="close" onclick="document.getElementById('top').style.display='none'">x</div>

<jdoc:include type="modules" name="anyleft" />

</div>

[Александр]

Александр Пунченко, мб, у вас где-то опечатка? По коду ошибок нет.
Добавьте еще console.log в события click и scroll, чтобы проверить, что события срабатывают.

[Александр Пунченко]

Повесил, срабатывает только scroll

[Александр]

Александр Пунченко, , а ошибку вы не видите в консоли?

Вы используете очень старую версию jQuery. В ней вместо off используется unbind.

[Александр Пунченко]

Спасибо Вам огромное! Вы меня очень выручили!

Answer 2

[Павел Диденко]

Поработай с localStorage. Запиши туда свойство при показе модалки, если свойство уже есть - ничего не делать, если нет - показать модалку. Читать тут клик

Comments

[Александр]

На самом деле, такой себе костыль.

[Павел Диденко]

Александр, почему костыль?

[Александр]

Павел Диденко, на самом деле не костыль, а просто другая реализация, которая преследует другие цели. Приношу свои извинения :).

Ну и изначально в вопросе было "один раз за посещение страницы", что не совсем про localStorage.