问题标签 [jquery-lazyload]

我对这个游戏还是新手，所以我可能会做一些愚蠢的事情，但我不太确定那是什么。我有一个使用 Bootstrap3 构建的投资组合网站。在此，我正在加载整页中未排序的图像列表，目前大约有 40 个左右。这些加载缓慢且不同步，所以我试图应用lazyload插件来帮助解决这个问题。我的图像列表链接到几个过滤器，这些过滤器根据它们的 li 类显示/隐藏它们。

过滤器工作正常。但是，当我试图让 Lazyload 工作时，我在所有图像加载之前单击过滤器，它们会得到预加载的灰色框图像。

你可以在这里看到它的实际效果。http://megmackayphoto.com/Beta/portfolio4.html

我还在这里添加了一个 JSfiddle：http: //jsfiddle.net/iameuanmackay/w5kwwjpm/ 带有缩减的图像列表（由于某种原因没有显示在小提琴上）。我拥有的代码在这里，尽管我很欣赏这并没有真正说明问题。

此外，在我的过滤器触发之前，这里有一个带有此代码的延迟加载触发器。

正如我所提到的，我可能正在做一些非常愚蠢的事情，但我无法弄清楚。任何帮助将不胜感激。如果我在这里遗漏了任何重要信息，请大喊大叫，我会尝试提供更多指示/信息。

谢谢

我有需要绝对定位的图像，以便图像的中心位于其父 div 的中心。我已经有执行此操作的代码。

我最近添加了延迟加载插件，它按预期工作。但是我需要一种在延迟加载加载并淡入图像后触发图像居中代码的方法。

我当前的代码基本上是这样的：

我找不到有关延迟加载的任何功能的任何信息，这些功能让我可以设置一个回调函数以在它运行淡入效果后运行。

I am using http://www.appelsiini.net/projects/lazyload but it is not working for an image result tabs that is generated by php loop and outputted using jquery ajax serializearray on bootstrap tabs. So I tried to put these codes in ajax success function and together with the output as but nothing worked.

Source: http://www.appelsiini.net/projects/lazyload/enabled_ajax.html

Source: Binding image lazy loading to new images inserted after ajax request

Thanks for the help!

Update

Part of the problem is found by setting the container. This code is added in ajax success function.

Then this one is added in document ready function.

Now the remaining problem is, the images in the other tab. The images don't load unless I scroll the page. I tried to trigger scroll when the tab is clicked but it didn't work. This is what I tried but both didn't work.

我正在使用bttrlazyloading插件来延迟加载页面上的所有图像。我有一个 div 列表，每个 div 里面都有一个图像。

我的内容是动态的，使用模板 (html) 我根据需要多少元素克隆 div。

这是我的代码：

当我完成构建我的页面时，我正在调用插件：

在我滚动到它们之前不会显示图像，我的问题是即使您仍然看不到它们，这些图标也会立即加载。

我可以在网络上看到。

我该如何解决？

根据jQuery.lazyload我想“延迟加载”的任何图像都需要将src属性替换为data-original.

我假设我可以使用 WordPress get_image_tag过滤器来做到这一点，但我一直坚持如何真正做到这一点。

为了使lazyload工作，lazy还需要在IMG上放置一个类，我设法使用WordPress get_image_tag_class过滤器开始工作

关于如何更改 IMG 输出以替换data-orginial而不是的任何想法src？

我在网站项目上使用 B-Lazy 插件（http://dinbror.dk/blog/blazy/）。我想根据窗口宽度加载不同的图像：

如果窗口宽度 < 420px，插件接受加载一个 img，其 'data-src' 被 'data-src-small' 替换。

因此，我想获取 data-src 图像 url 并在 '.jpg' 之前添加到末尾的 '-228x170' ，如下所示：

<img data-src="img-name.jpg" > 变得 <img data-src-small="img-name-228x170.jpg" >

这是我的代码：`

`

使用datatables javascript 插件，我想在带有分页的表格中显示 10k 小图像。
因为我加载了太多，我得到了错误。

我只想在它们出现时才加载这些图像，所以我找到了lazyload插件。

但是，图像一开始根本没有出现。
我必须手动输入

在浏览器控制台中。
然后只有它加载屏幕上的图像
（即当我向下滚动时，我看到所有其他图像都已卸载）。
这至少证明该插件有些工作。

使用数据表有什么特别的关系吗？
我是否必须每秒以脚本方式触发延迟加载？

谢谢 ！

大家好，我有一个问题，我正在为我的网站中的图像使用延迟加载。我使用服务器端获取前 10 个数据，这没关系。但是我使用 jquery> ajax 加载接下来的 10 个数据。我可以得到我想要的数据，但延迟加载功能不适用于新数据。

这是我观点的一部分

我尝试使用 getscript 加载，但它没有用。我应该怎么做才能再次触发它？谢谢你。

我有一个带有 require.js、underscore.js 的 Backbone.js 应用程序。现在我想使用带有Eislider 横幅的jquery 延迟加载插件。

在应用延迟加载脚本之前，横幅效果很好。

这就是我在主干视图中所做的：

这是使用 text.js 的 html 文件中的模板

应用延迟加载脚本后，图像停止显示。

知道是什么原因造成的。

我的模态图像似乎只能在 Chrome 下工作。在 Firefox 和 Internet Expoler 模态图像中生成错误代码：

在 Chrome 模态窗口中可以并且看起来：

我用来生成模态窗口的 JavaScript：