45 lines
1.5 KiB
Plaintext
45 lines
1.5 KiB
Plaintext
|
</main>
|
||
|
|
<dialog id="show-img"></dialog>
|
||
|
|
<footer>
|
||
|
|
<p>This page uses code from <a href="https://lostcave.ddnss.de/">https://lostcave.ddnss.de</a>.</p>
|
||
|
|
</footer>
|
||
|
|
<script>
|
||
|
|
var dialog_show_img = document.getElementById("show-img");
|
||
|
|
dialog_show_img.addEventListener("click", function(event) {
|
||
|
|
event.target.close();
|
||
|
|
}, false)
|
||
|
|
|
||
|
|
var images = document.getElementsByTagName("img");
|
||
|
|
for (var i=0; i<images.length; i++) {
|
||
|
|
images[i].addEventListener(
|
||
|
|
"click",
|
||
|
|
function(event) {
|
||
|
|
dialog_show_img.innerHTML = event.target.outerHTML;
|
||
|
|
dialog_show_img.appendChild(document.createElement('p')).innerText = event.target.getAttribute("alt");
|
||
|
|
if (event.target.width<300 || event.target.height<300) {
|
||
|
|
width = event.target.width * 2;
|
||
|
|
dialog_show_img.children[0].style = "width: " + width + "px; image-rendering: pixelated;"
|
||
|
|
}
|
||
|
|
dialog_show_img.children[0].addEventListener(
|
||
|
|
"click",
|
||
|
|
function(e){
|
||
|
|
dialog_show_img.close();
|
||
|
|
},
|
||
|
|
false
|
||
|
|
);
|
||
|
|
dialog_show_img.children[1].addEventListener(
|
||
|
|
"click",
|
||
|
|
function(e){
|
||
|
|
dialog_show_img.close();
|
||
|
|
},
|
||
|
|
false
|
||
|
|
);
|
||
|
|
dialog_show_img.showModal();
|
||
|
|
},
|
||
|
|
false
|
||
|
|
);
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
</html>
|