open preview when clicking on image
This commit is contained in:
parent
fc75c07473
commit
b2efb92a53
|
@ -1,3 +1,5 @@
|
||||||
|
import * as basicLightbox from 'basiclightbox'
|
||||||
|
|
||||||
class CustomImage extends HTMLElement {
|
class CustomImage extends HTMLElement {
|
||||||
async connectedCallback(){
|
async connectedCallback(){
|
||||||
const originalURL = new URL(this.getAttribute("src"), document.baseURI).href;
|
const originalURL = new URL(this.getAttribute("src"), document.baseURI).href;
|
||||||
|
@ -28,6 +30,16 @@ class CustomImage extends HTMLElement {
|
||||||
image.setAttribute("loading", "lazy");
|
image.setAttribute("loading", "lazy");
|
||||||
image.setAttribute("original-src", originalURL);
|
image.setAttribute("original-src", originalURL);
|
||||||
this.appendChild(image);
|
this.appendChild(image);
|
||||||
|
|
||||||
|
|
||||||
|
if(!(this.getAttribute("data-noPreview") === "true")) {
|
||||||
|
image.onclick = () => {
|
||||||
|
const instance = basicLightbox.create(`
|
||||||
|
<img src="${originalURL}">
|
||||||
|
`);
|
||||||
|
instance.show();
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue