时间戳

首页 > 解决方案 > WordPress 延迟加载图像破坏 Fancybox

javascript - WordPress 延迟加载图像破坏 Fancybox

问题描述

我正在使用 WordPress。花哨的盒子和一个惰性加载器插件。但是，自从添加了延迟加载插件后，花哨的盒子就停止了工作。

当您启动 fancybox 插件时，您可以使用一些 javascript 来执行此操作，如下所示：

var select = $('a[href$=".bmp"],a[href$=".gif"],a[href$=".jpg"],a[href$=".jpeg"],a[href$=".png"],a[href$=".BMP"],a[href$=".GIF"],a[href$=".JPG"],a[href$=".JPEG"],a[href$=".PNG"]');

select.attr('rel', 'fancybox');
select.fancybox();

当文档加载时，这会与其余的 javascript 一起触发。但是，现在我收到此错误：

select.fancybox 不是函数

我假设延迟加载插件正在将图像排除在等式之外，因此该函数无法执行任何操作。

之后我尝试再次附加它，但我觉得我走错了方向：

$('html').on('mousemove', 'a[href$=".bmp"],a[href$=".gif"],a[href$=".jpg"],a[href$=".jpeg"],a[href$=".png"],a[href$=".BMP"],a[href$=".GIF"],a[href$=".JPG"],a[href$=".JPEG"],a[href$=".PNG"]', function(){

            $(this).attr('rel', 'fancybox');
            $(this).fancybox();
            
        });

有任何想法吗？

标签： javascriptwordpressfancyboxlazy-loading

解决方案

WordPress 现在包括所有图像的浏览器级延迟加载属性，使用“加载”图像属性 ( loading="lazy")。也许您不再需要延迟加载插件？

见这里： https ://make.wordpress.org/core/2020/01/29/lazy-loading-images-in-wordpress-core/

推荐阅读