javascript - WebGL + Lightbox2

Question

我正在尝试在我有 WebGL 画布的页面上使用 Lightbox2。

所以我的画布动态加载随机图像，我想拥有它，这样当用户双击图像时，它会弹出一个像 Lightbox2 一样的效果。

现在，我有它，这样当双击事件被触发时，它会将图像的 url 发布到控制台中。我想从缓存中提取或重新下载图像（不理想）并将其显示在 Lightbox2 弹出窗口中。然后，当用户完成查看后，他们可以关闭它并返回查看画布。

有谁知道我该怎么做？

谢谢！

编辑：如果有人想看的话，这里是 Lightbox2 的链接

Answer 1

在没有看到您的项目的情况下，问题似乎是 Lightbox2 旨在通过单击链接来激活。您显然能够从您在 WebGL 中单击的任何内容中获取正确的 URL，这是困难的部分。

接下来，您将需要创建一个链接元素，使用您需要的属性对其进行设置，快速将其添加到 DOM，触发点击，然后将其从 DOM 中移除。

var TempLink = document.createElement('a');

//Set the attributes that Lightbox2 uses. Your needs will vary.
TempLink.setAttribute('href', 'your/image/url.jpg');
TempLink.setAttribute('data-lightbox', 'your-set');
TempLink.setAttribute('data-title', 'My Image Title!');

//Disable rendering, even though it shouldn't draw anyway.
TempLink.style.display = 'none';

//Add to DOM, click it, and immediately remove it.
document.getElementsByTagName('body')[0].appendChild(TempLink);
TempLink.click();
document.getElementsByTagName('body')[0].removeChild(TempLink);