ページがトップ・イメージにあるときはJavaScriptを隠していません

Question

次のタスクを実行するこのコードがあります。ページが最初にロードされたときに非表示になっています。それ以外の場合は表示されます。私が書いたコードは理にかなっていますが、ページが読み込まれたときに一度しか動作しないようです。

$(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

あなたもスクロールイベントに非表示機能を追加する必要があります。

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

とタイムアウトの外にこのブロックを移動します。

ここでは、作業は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>