0

WebGL キャンバスがあるページで Lightbox2 を使用しようとしています。

したがって、キャンバスはランダムな画像を動的にロードし、ユーザーが画像をダブルクリックすると、Lightbox2 のような効果でポップアップするようにしたいと考えています。

現在、ダブルクリックイベントが発生すると、画像へのURLがコンソールに投稿されるようにしています。キャッシュからプルするか、画像を再ダウンロードして (理想的ではありません)、Lightbox2 ポップアップ内に表示したいと考えています。次に、ユーザーが見終わったら、それを閉じて、キャンバスの表示に戻ることができます。

誰も私がこれを行う方法を知っていますか?

ありがとう！

編集:誰かが見たい場合は、ここに Lightbox2 へのリンクがあります

4

1 に答える 1

0

プロジェクトが表示されない場合、問題は、Lightbox2 がリンクをクリックしてアクティブになるように設計されていることにあるようです。どうやら WebGL でクリックしたものから正しい URL を取得できるようですが、これは難しい部分です。

次に、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);
于 2015-04-23T23:38:19.310 に答える