페이지가 최상위 이미지에있을 때 자바 스크립트가 숨겨져 있지 않습니다.

Question

다음 작업을 수행하는 코드가 있습니다. 페이지가 처음로드되면 숨겨집니다. 그렇지 않으면 표시됩니다. 필자가 작성한 코드는 완벽하게 이해할 수 있지만 페이지가로드 될 때 한 번 작동하는 것으로 보입니다.

$.scrollTop = function() { 
    if ($(document).scrollTop() === 0) { 
     $('.verb_logo_w').hide(); 
    } else { 
     $('.verb_logo_w').show(); 
    } 
}; 
//onScroll 
$(window).on('scroll', function() { 
    $.scrollTop(); 
}); 
//Init 
$.scrollTop(); 

을 그리고 타임 아웃의 외부에서이 블록을 이동 :

$(document).ready(function(){ 
    setTimeout(function(){ 
     xyz = $('.verb_logo_w'); 

     if(document.body.scrollTop === 0){ 
      xyz.hide(); 
     }; 

     window.onscroll = function(e){ 
      xyz.show(); 
     }; 
    },10); 
}); 

Answer 1

당신은 너무 스크롤 이벤트에 숨기기 기능을 추가해야합니다.

여기가 작동합니다. jsFiddle입니다.

텍스트는 페이지로드시 scrollTop 값이 0이 아니고 스크롤 할 때만 나타납니다.

Answer 2

"스크롤"이벤트를 올바르게 사용하지 않았습니다.

$(document).ready(function() { 
 
    
 
    $xyz = $('.verb_logo_w'); 
 
    
 
    function pageScrolled() { 
 
    var scrollTop = $(document).scrollTop(); 
 
    
 
    // informative purpose 
 
    console.log("scrollTop value: " + scrollTop); 
 
    
 
    if(scrollTop === 0) { 
 
     $xyz.show(); 
 
    } else { 
 
     $xyz.hide(); 
 
    } 
 
    } 
 

 
    $(window).on("scroll", pageScrolled); 
 
});

body { 
 
    height: 3000px; 
 
} 
 

 
.verb_logo_w{ 
 
    height: 200px; 
 
    width: 200px; 
 
    background: blue; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="verb_logo_w"><div>