63 lines
1.5 KiB
JavaScript
63 lines
1.5 KiB
JavaScript
function divhider() {
|
|
var x = document.getElementsByClassName("flashed");
|
|
x[0].style.visibility = "hidden";
|
|
}
|
|
|
|
|
|
function animation() {
|
|
var x = document.getElementsByClassName("flashed");
|
|
x[0].style.animation = "disparition 0.2s 1";
|
|
}
|
|
|
|
window.setTimeout(divhider, 2200);
|
|
window.setTimeout(animation, 2000);
|
|
|
|
let darkBoxVisible = false;
|
|
|
|
window.addEventListener('load', (event) => {
|
|
let images = document.querySelectorAll("img");
|
|
if(images !== null && images !== undefined && images.length > 0) {
|
|
images.forEach(function(img) {
|
|
img.addEventListener('click', (evt) => {
|
|
showDarkbox(img.src);
|
|
});
|
|
});
|
|
}
|
|
});
|
|
|
|
function showDarkbox(url) {
|
|
if(!darkBoxVisible) {
|
|
let x = (window.innerWidth - 1280) / 2;
|
|
let y = window.scrollY + 50;
|
|
|
|
// Create the darkBox
|
|
var div = document.createElement("div");
|
|
div.id = "darkbox";
|
|
var tmp = url;
|
|
tmp = tmp.replace("thumbnails/", "");
|
|
tmp= tmp.trim();
|
|
div.innerHTML = '<img class="darkboximg" src="'+tmp+'" />';
|
|
document.body.appendChild(div);
|
|
let box = document.getElementById("darkbox");
|
|
box.style.left = x.toString()+"px";
|
|
box.style.top = y.toString()+"px";
|
|
box.style.height = 'auto';
|
|
box.addEventListener('click', (event) => {
|
|
// Remove it
|
|
let element = document.getElementById("darkbox");
|
|
element.parentNode.removeChild(element);
|
|
|
|
darkBoxVisible = false;
|
|
})
|
|
|
|
darkBoxVisible = true;
|
|
|
|
} else {
|
|
// Remove it
|
|
let element = document.getElementById("darkbox");
|
|
element.parentNode.removeChild(element);
|
|
|
|
darkBoxVisible = false;
|
|
}
|
|
}
|