当页面在顶部的图像是不隐藏javascript

When page is at the top image is not hiding javascript

本文关键字：隐藏 javascript 图像 顶部      更新时间：2023-09-26

我有执行以下任务的代码:当页面最初加载时，它是隐藏的;否则会显示出来。我写的代码很有意义，但是当页面加载时，它似乎只工作一次。

$(document).ready(function(){
    setTimeout(function(){
        xyz = $('.verb_logo_w');
        if(document.body.scrollTop === 0){
            xyz.hide();
        };
        window.onscroll = function(e){
            xyz.show();
        };
    },10);
});

您还需要为滚动事件添加隐藏函数:

 $.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，并且在滚动

你没有正确使用"scroll"事件。

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

相关文章：