WebGL + Lightbox2

Question

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

所以我的画布动态加载随机图像，我想让它在用户双击图像时弹出，效果就像Lightbox2一样。

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

有人知道我是怎么做到的吗？

谢谢!

编辑：Here's a link to Lightbox2 if anyone wanted to see it

Answer 1

在没有看到你的项目的情况下，问题似乎是Lightbox2被设计成通过点击一个链接来激活的。显然，你可以从你在WebGL中点击的任何东西中获得正确的网址，这是困难的部分。

接下来，您将需要创建一个link元素，为其设置所需的属性，快速将其添加到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);