Javascript 延迟加载映像不'；直到滚动时才显示在选项卡中

我知道有很多关于这个问题的话题，但我没有找到解决办法。 我有一个带有选项卡的下拉菜单，当包含图像的选项卡处于活动状态时，图像在我滚动之前不会出现

我尝试了其中一些，但仍然不起作用：

$("img.lazy").show().lazyload()
   $(window).resize()

---

如有任何帮助，将不胜感激。

文档：

可以通过事件触发的状态

我将这些图像的类更改为

lazymenu

（以防有其他惰性图像）

然后，将这一行添加到顶部的导航下拉菜单触发器中：

$（'img.lazymenu'）。触发器（'click'）

然后，将您的懒惰调用更新为：

$（“img.lazymenu”）.show（）.lazyload（{event:'click'}）

小提琴：文档：

可以通过事件触发的状态

我将这些图像的类更改为
lazymenu
（以防有其他惰性图像）

然后，将这一行添加到顶部的导航下拉菜单触发器中：

$（'img.lazymenu'）。触发器（'click'）

然后，将您的懒惰调用更新为：

$（“img.lazymenu”）.show（）.lazyload（{event:'click'}）

小提琴：
简单使用。此lazyloader自动检测当前和未来img元素的任何可见性更改，并且运行速度也比旧的jquery lazyload快得多

只需添加lazysizes脚本和类
lazyload
，并使用
datasrc
而不是普通的
src
属性

如果您想保留类
惰性标记
和
数据原始标记
标记，您还可以配置lazysizes以获取这些标记：

window.lazySizesConfig = window.lazySizesConfig || {};

// use .lazy instead of .lazyload
window.lazySizesConfig.lazyClass = 'lazy';

// use data-original instead of data-src
lazySizesConfig.srcAttr = 'data-original';

这是一张工作票


您真的不应该触发一个常规的调整大小事件（加载时）。许多小部件都会侦听此事件，并在发生调整大小（=对性能非常不利）时重新布局。
只需使用即可。此lazyloader自动检测当前和未来img元素的任何可见性更改，并且运行速度也比旧的jquery lazyload快得多

只需添加lazysizes脚本和类
lazyload
，并使用
datasrc
而不是普通的
src
属性

如果您想保留类
惰性标记
和
数据原始标记
标记，您还可以配置lazysizes以获取这些标记：

window.lazySizesConfig = window.lazySizesConfig || {};

// use .lazy instead of .lazyload
window.lazySizesConfig.lazyClass = 'lazy';

// use data-original instead of data-src
lazySizesConfig.srcAttr = 'data-original';

这是一张工作票


您真的不应该触发一个常规的调整大小事件（加载时）。很多小部件都会监听此事件，并会在发生调整大小（=对性能非常不利）的情况下重新布局。
如果没有太多的图像，您可以不在其上使用懒散加载。我将添加更多选项卡和更多图像，小提琴只是一个例子如果没有太多图像，你可以不在他们身上使用lazyload。我会添加更多的标签和更多的图像，小提琴只是用于示例，非常感谢：）我可以问你一些其他问题吗，是否可以只加载标签中包含的图像？我的意思是，当我们悬停在选项卡1上时，加载并显示来自选项卡1的图像，但在没有悬停在选项卡2、选项卡3上之前，不要加载其他图像。。。谢谢你的时间，我非常感谢，你可以这样做（加载个人图片）。这并不像我提供的解决方案那么简单，因为您必须连接每个图像。我看看我能不能编一把小提琴。谢谢你，我期待着你的反馈：）嗯，事实上，那还不错。请注意，我正在加载主菜单悬停中的第一个图像，因为它默认显示。非常感谢：）我可以问您一些其他问题吗，是否可以只加载包含在选项卡中的图像？我的意思是，当我们悬停在选项卡1上时，加载并显示来自选项卡1的图像，但在没有悬停在选项卡2、选项卡3上之前，不要加载其他图像。。。谢谢你的时间，我非常感谢，你可以这样做（加载个人图片）。这并不像我提供的解决方案那么简单，因为您必须连接每个图像。我看看我能不能编一把小提琴。谢谢你，我期待着你的反馈：）嗯，事实上，那还不错。请注意，我正在加载主菜单悬停上的第一个图像，因为它默认显示。