Question

我要淡化一个设置为显示的图像：无，这就是我正在做的不适合我的事情

HTML：

<img src="img/myimg.jpg" id="img">

CSS：

#img{
    display:none;
}

JS：

$(window).scroll(function() {
    if ($(this).scrollTop() > 0) {
        $('#img').fadeIn();                     
    }
});

Answer 1

尝试在ready()函数中添加代码：

$(function(){
  $(window).scroll(function() {
    if ($(this).scrollTop() > 0) {
        $('#img').fadeIn();                     
    }
  });
});

#img{
    display:none;
} 

body{
    height: 1000px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img src="https://assets.entrepreneur.com/content/16x9/822/20141230193127-work.jpeg" id="img"/>

Answer 2

jquery .fadeIn()赢得了覆盖display：none;如果您使用opacity: 0;和visibility: hidden;作为样式规则，则可能会有效。

您还可以在页面加载时尝试$('#img').hide();。

Answer 3

 $(window).scroll(function(){
    if ($(this).scrollTop() > 0) {
    $("#img").hide();
    }
    else{
      $("#img").show();
    }

当您上下滚动窗口时，这将隐藏并显示图像，非常有用

Jquery：在页面滚动上显示隐藏的图像

3 个答案: