I am trying to get a div to fade in using javascript when a user scolls down the page, the problem i am having is although it fades in it is fading in and fading out multiple times very quickly like its pulsating.
i only want it so that the div fades in slowly once when the user scrolls down the page. can someone please help?
<script>
$(window).scroll(function(){
var leftToBottom = $(document).height() - $(window).height() - $(window).scrollTop();
var distanceFromTop = $(window).scrollTop();
if( distanceFromTop > 600 && !$("profile_intro_case5").is(":visible")
&& leftToBottom > 600) {
$(".profile_intro_case5").fadeIn();
}else if($(".profile_intro_case5").is(":visible") && (distanceFromTop < 600 || leftToBottom < 600)){
$(".profile_intro_case5").fadeOut();
}
});
</script>
Check that the element is not currently being animated: !$(".profile_intro_case5").is(":animated")
$(window).scroll(function(){
var leftToBottom = $(document).height() - $(window).height() - $(window).scrollTop();
var distanceFromTop = $(window).scrollTop();
if( distanceFromTop > 600 && !$("profile_intro_case5").is(":visible")
&& leftToBottom > 600 && !$(".profile_intro_case5").is(":animated")) {
$(".profile_intro_case5").fadeIn();
}else if($(".profile_intro_case5").is(":visible") && (distanceFromTop < 600 || leftToBottom < 600) && !$(".profile_intro_case5").is(":animated")){
$(".profile_intro_case5").fadeOut();
}
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.