jQuery LazyLoad在滚动之前不加载图像

jQuery LazyLoad不会在打开页面的可见部分加载图像，直到我在1px上滚动页面。

当我滚动页面所有工作正确

更新：

CoffeScript

jQuery -> $("img.lazy").show().lazyload() $(window).resize() 

但是$(window).resize()只有在我加载页面时从浏览器的控制台输入它才有帮助

Answer 1

您的图像必须设置宽度和高度。

Answer 2

 $("img.lazy").lazyload({ threshold : 50 }); 

并添加这个：

 $(window).load(function(){ $("html,body").trigger("scroll"); }); 

Answer 3

试试这个….

 $(function() { $("img.lazy").show().lazyload() window.onload = function() { $(window).resize() }; }); 

Answer 4

当前版本的Lazyload会在窗口加载事件时触发初始更新。 因此，如果您稍后动态加载图像 – 您需要一个额外的事件，例如滚动以触发更新周期。 这是我的问题，图像仅在滚动后显示。

Answer 5

我太迟了但如果您仍然遇到此问题，请在您所需的事件上使用纯javascript setTimeout（）和window.scrollBy（）组合。 我在onClick上解决了它，因为我必须在选项卡式窗格下显示图像，其中只有第一个加载的选项卡在页面加载时显示图像，但是其他选项卡在单击时没有显示，直到用户滚动一点。 我的代码如下：

 function myFunction() { setTimeout(function() { window.scrollBy(0, 100) }, 1000);; } 

  Click me to scroll after 1000 milliseconds 
 

Answer 6

这就是我解决这个问题的方法：

 $("html,body").on('scroll', function(){ $(window).resize() }); 

它非常简单，只是在body和html标签的滚动事件上创建一个window.resize。 咣当。

Answer 7

每当我按某些事情过滤时，我通过$.post()查询获取我的图像，因此我需要在每次重新加载时运行所有内容

 $.post( "queries.php", { var1:var1, var2:var2, .. }, function(response){ for( var i=0; i 

Answer 8

初始化lazyload时，您可以告诉它触发哪些事件（默认设置为’scroll’）。 我建议在该列表中添加一个自定义事件，并在有意义的时候触发它：

 $('.lazy').lazyload({ event: 'scroll whenever-i-want' }); // whenever you want to trigger your event (after ajax load, on dom ready, etc...) $(document).trigger('whenever-i-want'); 

这将保留默认滚动function，但也允许您按需触发延迟加载。

Answer 9

正如在这个SO问题中找到的那样，将skip_invisible设置为false可以解决我的问题

Answer 10

 $(document).ready(function () { $("img.lazy").lazyload({ 
placeholder: rooturl + "Themes/images/imgloading.gif",
 effect: "fadeIn",
 skip_invisible: false
 });
 });
 $(document).ready(function() {
 $(window).load(function() {
 update();
 }); 
 });
 

使用这个延迟加载脚本https://github.com/tuupola/jquery_lazyload/blob/master/jquery.lazyload.js#L130

Answer 11

对于具有按z-index排序的多个图像的滑块，lazyload选项failure_limit上用场。

有关此选项的更多详细信息，请访