From 7f631c493d04ba96e36975365532e2172fec367e Mon Sep 17 00:00:00 2001 From: Mitja Felicijan Date: Thu, 7 Oct 2021 21:13:14 +0200 Subject: Added dithered images --- template/_meta.html | 4 ++-- template/script.js | 16 ++++++++++++++++ template/style.css | 1 + 3 files changed, 19 insertions(+), 2 deletions(-) (limited to 'template') diff --git a/template/_meta.html b/template/_meta.html index 9d92e34..b617f0f 100755 --- a/template/_meta.html +++ b/template/_meta.html @@ -3,10 +3,10 @@ - + - + diff --git a/template/script.js b/template/script.js index 8b13789..3d80484 100755 --- a/template/script.js +++ b/template/script.js @@ -1 +1,17 @@ +// dither image on mouse over replace +document.querySelectorAll('article img').forEach(img => { + const ditheredImage = img.src; + const originalImage = img.src.replace('.dith.gif', ''); + + img.addEventListener('mouseover', evt => { + evt.target.src = originalImage; + console.log('mouseover') + }); + + img.addEventListener('mouseout', evt => { + evt.target.src = ditheredImage; + console.log('mouseout') + }); + +}); diff --git a/template/style.css b/template/style.css index 8152dab..8da06fd 100755 --- a/template/style.css +++ b/template/style.css @@ -307,6 +307,7 @@ article img { position: relative; left: -10%; margin: 70px auto; + border: 1px solid #eee; } article strong { -- cgit v1.2.3