got lightbox working on .clickSpan

This commit is contained in:
Jonas Leder 2021-03-24 23:19:18 +01:00
parent ad31076b67
commit 5a06eaec9e
2 changed files with 5 additions and 6 deletions

View file

@ -1,15 +1,14 @@
import * as basicLightbox from 'basiclightbox'
let images = document.getElementsByTagName("img");
let images = document.querySelectorAll("img, .clickSpan");
for(let i = 0; i < images.length; i++){
let element = images[i];
if(!(element.getAttribute("data-noPreview") === "true")) {
element.onclick = () => {
console.log("render");
const instance = basicLightbox.create(`
<img src="${element.src}">
<img src="${element.getAttribute("src")}">
`);
instance.show(() => console.log('lightbox now visible'))
instance.show();
}
}
}

View file

@ -6,8 +6,8 @@ include "internal/comments.php";
getHeader("Bildquellen", "");
?>
<ul>
<li><span class="clickSpan" onclick="createDialogImage('/img/bannerHome.webp')">Bild oben</span>: Photo by <a href="https://unsplash.com/@hishahadat?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Shahadat Rahman</a>&nbsp;on&nbsp;<a href="https://unsplash.com/s/photos/programmer?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Unsplash</a></li>
<li><span class="clickSpan" onclick="createDialogImage('/img/bildHome.webp')">Bild Startseite</span>: Photo by&nbsp;<a href="https://unsplash.com/@grohsfabian?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Fabian Grohs</a>&nbsp;on&nbsp;<a href="https://unsplash.com/s/photos/programmer?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Unsplash</a></li>
<li><span class="clickSpan" src='/img/bannerHome.webp'>Bild oben</span>: Photo by <a href="https://unsplash.com/@hishahadat?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Shahadat Rahman</a>&nbsp;on&nbsp;<a href="https://unsplash.com/s/photos/programmer?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Unsplash</a></li>
<li><span class="clickSpan" src='/img/bildHome.webp'>Bild Startseite</span>: Photo by&nbsp;<a href="https://unsplash.com/@grohsfabian?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Fabian Grohs</a>&nbsp;on&nbsp;<a href="https://unsplash.com/s/photos/programmer?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Unsplash</a></li>
</ul>
<?php
getFooter();