Как показать div на прокрутке с затуханием через некоторое время? Хотите использовать эффект fadein/fadeout без цикла

Question

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

CSS

.onscrollbutton { 
    display: none; 
} 

JQuery

<script> 
    $(window).scroll(function(){ 
    $(".onscrollbutton").css("display","block").delay(5000).fadeOut("slow"); 
    }); 
</script> 

Стирание CSS и изменения кода JQuery на это приводит к петле FadeIn/Затухание, даже если пользователь не прокручивается:

<script> 
    $(window).scroll(function(){ 
    $(".onscrollbutton").fadeIn("slow").delay(5000).fadeOut("slow"); 
    }); 
</script> 

Как я могу достичь первого эффекта, но с плавным переходом?

Answer 1

fadeOut вызывает действие прокрутки, потому что оно в основном снимает высоту элемента .onscrollbutton. Попробуйте абсолютное позиционирование элемента, и оно должно работать. Работал для меня.