10
JAN

BLazy - Un lazyloader d'images sans dépendance efficace

Publié le 10/01/14 à 09h57 par DJo

Blazy est un script de Lazyload d'images simple et efficace pour optimiser le chargement de vos pages.

Blazy est un script de Lazyload d'images simple et efficace pour optimiser le chargement de vos pages.

Si vous affichez un grand nombre d'images sur vos pages web, il peut être intéressant de mettre en place un système de Lazyload pour optimiser le temps de chargement de votre page.

BLazy (à prononcer Be Lazy) est un script de Lazyload simple ne nécessitant pas de dépendances Javascript supplémentaires. Lui même ne pèse qu'1Kb quand il est compressé.

Si vous utilisez un périphérique de 420px ou moins de largeur, il est possible d'afficher une image plus petite et moins consommatrice en bande passante. 

Blazy est un script de Lazyload d'images simple et efficace pour optimiser le chargement de vos pages.

Un loader est affiché pendant le chargement de l'image et peut être supprimé dès qu'elle est prête à être affichée grâce au callback.

Voici un exemple d'utilisation du script:

    var bLazy = new Blazy({ 
        multi: [{
    width: 420 // Max-width
          , src: 'data-src-small'
}]
      , success: function(element){
    setTimeout(function(){
// Suppression du loader quand le chargement est prêt
var parent = element.parentNode;
parent.className = parent.className.replace(/bloadingb/,'');
    }, 200);
        }
   });

A utiliser sans modération !

 

Site Officiel

Personne n'a baraguiné de chtite phrase pour le moment !


Ajouter un Commentaire

Pour poster un commentaire, vous devez être identifié. Vous pouvez choisir parmi ces trois méthodes d'identification:

Compte la Ferme du Web

Identifiez-vous
Inscrivez-vous

Compte Facebook

Connexion avec Facebook

Compte Twitter

Connexion avec votre compte twitter
Rechercher sur la Ferme du web