jonasled2/website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

open preview when clicking on image

Browse source
This commit is contained in:
Jonas Leder 2022-05-01 12:58:57 +02:00
parent fc75c07473
commit b2efb92a53
No known key found for this signature in database
GPG key ID: CC3C488E27DFF5CA
1 changed files with 12 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
js/customElements/image.js
View file

@ -1,3 +1,5 @@
import * as basicLightbox from 'basiclightbox'
class CustomImage extends HTMLElement {
async connectedCallback(){
const originalURL = new URL(this.getAttribute("src"), document.baseURI).href;
@ -28,6 +30,16 @@ class CustomImage extends HTMLElement {
image.setAttribute("loading", "lazy");
image.setAttribute("original-src", originalURL);
this.appendChild(image);
if(!(this.getAttribute("data-noPreview") === "true")) {
image.onclick = () => {
const instance = basicLightbox.create(`
<img src="${originalURL}">
`);
instance.show();
}
}
}
}