在Lazy Load插件的文档(仅在事件发生时加载图像的jQuery插件)中说:
事件可以是任何jQuery事件,例如 单击或鼠标悬停。你也可以使用 您自己的定制活动,如运动型 或foobar。默认是等到 用户向下滚动并显示图像 窗户。防止所有图像 加载到它们的灰色占位符 点击图片即可:
$("img").lazyload({
placeholder : "img/grey.gif",
event : "click"
});
在这种情况下是单击图像,但如何通过单击其他元素而不是图像本身(例如锚链接/按钮)来触发图像加载?
答案 0 :(得分:3)
使用.trigger()
启动click
事件,即
$(function() {
$("img").lazyload({
placeholder : "img/grey.gif",
event : "click"
});
$('#clickme').click(function() {
$('img').trigger('click');
});
});
答案 1 :(得分:1)
jQuery Lazy Load plugin的演示页面似乎对Mac上的FF3.6不起作用。我正在使用Firebug的Net选项卡观察HTTP请求,我可以看到加载的所有图像都已加载。
也许值得一试这个名为JAIL的插件,它完美无缺。如果你看一下example2,它与你想要的类似。
您的HTML可能如下所示:
<img name="img/grey.gif" src="/global/images/blank.gif" width="width" height="height"/>
<a href"clickable">Click here to load the image</a>
并在导入插件后,您可以通过以下方式调用该函数:
$('img').jail({
event : "click",
selector : "a.clickable"
};
答案 2 :(得分:0)
只是另一个建议,我创建了一个延迟加载插件,如果元素进入视图,它将运行一个事件。它被挂钩到滚动事件但是通过使用$.fn.lazyloadanything('load')
它将强制视图中的任何元素的所有加载事件。可能不是你想要的,但可能有用: