PROJET AUTOBLOG


Warrior du Dimanche

Site original : Warrior du Dimanche

⇐ retour index

BlurHash

lundi 6 janvier 2020 à 16:40

Mmmm... c'est un peu compliqué pour juste ça, non ? ou c'est moi ? (j'ai ptêt pas tout compris )

je me disais que pour les jpeg, ce serait peut-être possible de combiner un jpeg progressif avec un style:blur() jusqu'au chargement de l'image, lors duquel on virerait le blur via js.

genre:

css:
img.blur{
    filter:blur(50)
}

et en js:
img=document.getElementsByTagName("img");
[].forEach.call(img, function(el) {
    el.addEventListener("onload", function(image){
        image.classList.remove("blur");
    });
});

L'avantage, c'est qu'il n'y a rien en backend... C'est juste une idée, j'ai pas DU TOUT testé, hein...

Via https://sebsauvage.net/links/
<link rel="stylesheet" href="http://www.warriordudimanche.net/./plugins/Galart/style.css"/> <link rel="stylesheet" href="http://www.warriordudimanche.net/./plugins/Galart/assets/lightbox.css"/> <script src="http://www.warriordudimanche.net/./plugins/Galart/assets/lightbox.js"> <script>[].forEach.call(document.querySelectorAll("[lightbox]"), function(el) { el.lightbox = new Lightbox(el);});

► Commentaires