【发布时间】:2020-01-23 10:33:30
【问题描述】:
大家好,我有一个我真的无法解决的问题。我在产品详细信息页面 (pdp) 上使用 owl carousel 来显示产品的多个图像。由于我想开始一个 AB 测试来更改图像的显示和数量,我使用 CSS 代码来隐藏 owl carousel 的控制按钮并一次显示所有图片,并且不再真正使用滑块选项:
但现在我遇到的问题是第一张图片是预加载的,但是我添加后的所有新图片由于延迟加载而具有加载动画。
当我点击控制按钮时,它们会被加载,所以我想为什么不通过点击 jQuery 来伪造它,但 owl carousel 似乎无法识别它
jQuery('.owl-next').trigger('click');
此代码适用于所有其他元素,但不适用于控制按钮。您是否知道如何手动激活所有图像的加载?
提前致谢:)
【问题讨论】:
-
我刚刚找到了一种解决方法,可以将 data-src 属性的值(因为图像存在那里)加载到我刚刚创建的 src 属性中:
var newthumbnail = jQuery('.owl-item.loading:nth-child(1) .item a img').attr('data-src'); jQuery('.owl-item.loading:nth-child(1) .item a img').prop('src', newthumbnail);
标签: jquery css owl-carousel