当滚动到顶部而不是底部时添加元素

这一定是一些愚蠢的错误，但在我的javascript函数中，当我到达屏幕底部时应该执行的if表达式正在执行，当我到达屏幕顶部时... 这里是我的代码：当滚动到顶部而不是底部时添加元素

$(window).scroll(function() {  //detect page scroll   
    if($(window).scrollTop() + $(window).height() == $(document).height()) //user scrolled to bottom of the page? 
     { 
     $('.animation_image').show(); //show loading image 
     } 
});

.animation_image是，当我到达屏幕的底部，当我回来到屏幕顶部向下滚动，然后应该出现，但出现一个加载图片...

如果有人能解释我做错了什么，那会很棒！

来源

2015-11-08 Jackymamouth

似乎是工作的罚款。 http://codepen.io/anon/pen/wKYqzz – Shikkediel

它似乎也适用于我。 $（document）.height的价值是多少？ – Bigalow

$（document）.height value is 800 – Jackymamouth

它应该正常工作。尽管出于好奇，但这些代码从未隐藏图像。难道它不应该让你把它藏起来吗？你去那里，一个小提琴https://jsfiddle.net/3eg18L8u/

$(window).scroll(function() {  //detect page scroll   
if($(window).scrollTop() + $(window).height() == $(document).height()) //user scrolled to bottom of the page? 
    { 
    $('.animation_image').show(); //show loading image 
    } 
else { 
    $('.animation_image').hide(); //show loading image 
}

}）;

来源

2015-11-08 00:35:23 Shiroo

我在HTML中有这个元素： '

' 图像默认为隐藏 – Jackymamouth

我几乎可以肯定，它应该正常工作。你没有任何奇怪的消息在控制台或任何东西？导致你做这件事的方式（检查底部）现在是相当知名和广泛使用的，它应该简单地工作。也是什么浏览器？我想说这可能是原因。 Miles O'Keefe对于“适用于所有浏览器”的解决方案也提供了很好的回应，可能适合您（如果真的是浏览器）。 http://stackoverflow.com/a/10795797/5538090 – Shiroo

尝试不幸没有工作：/去替代方式，只是发布它 – Jackymamouth

你试过> =而不是==吗？

if ($(window).scrollTop() + $(window).height() >= $(document).height())  
{ 
    $('.animation_image').show(); //show loading image 
}

如何：

$(document).ready(function(){ 
    $(window).scroll(function(e){ 
     e.stopPropagation(); 
     e.preventDefault(); 
     var scrollBottom = $(document).height() - $(window).scrollTop() - $(window).height(); 
     if (scrollBottom == 0) { 
      $('.animation-image').show(); 
     } 
    }); 
});

来源

2015-11-08 00:36:04 Nitin

不解决问题：/只是让图像显示，而不必向下滚动然后备份 – Jackymamouth

只是试过，仍然会有相同的错误：/ – Jackymamouth

尝试添加另一部分到向下滚动时触发的if函数。例如。如果（currentPositionY> previousPositionY && scrollBottom == 0）...一个黑客的位虽然... – Nitin

我似乎无法理解为什么它不与你们的所有帮助，甚至是工作，所以我放弃了，决定去使用此代码至极不是解决办法，但更多的替代：

function yHandler(){ 
var wrap = document.getElementById('wrap'); 
var contentHeight = wrap.offsetHeight; 
var yOffset = window.pageYOffset; 
var y = yOffset + window.innerHeight; 
if(y >= contentHeight){ 
    $('.animation_image').show(); 
} 
    var status = document.getElementById('status'); 
    status.innerHTML = contentHeight+" | "+y; 
}window.onscroll = yHandler

随着html内容结构等如下：

<body>  
<div id="status">0 | 0</div> 
<div id="wrap"> 
*ALL CONTENT* 
</div> 
</body>

和CSS：

div#status{position:fixed; font-size:24px;}

来源

2015-11-08 01:49:42 Jackymamouth

https://www.developphp.com/video/JavaScript/Scroll-Load-Dynamic-Content-When-User-Reach-Bottom-Ajax – Jackymamouth

当滚动到顶部而不是底部时添加元素

回答

相关问题