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

您没有使用＆＃34;滚动＆＃34;事件正常。

＆＃13;

$(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);
});

＆＃13;

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

＆＃13;

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

＆＃13;

当页面位于顶部时，图片未隐藏javascript

2 个答案: