Créer un système de notification en JavaScript

7 Mars 2014 à 00:00 Programmation

Je ne publierai plus rien sur ce blog. Un nouveau blog existe maintenant. Il se nomme Hardly Smart.

Vous pourrez y retrouver des astuces plus larges sur l'informatique ainsi que mes anciens billets de blog.

Je vous souhaite une bonne lecture sur Hardly Smart.


Peut être que pour un de vos projets web vous avez l'intention de faire un système de notifications mais le favicon restait statique ? Et bien maintenant vous pourrez le modifier en quelques lignes de JavaScript.

Avec le plugin favico.js vous pourrez créer autant de notifications que vous souhaitez.

Ce plugin, fonctionne assez facilement (vous pourrez créer le même système si vous le souhaitez), il crée juste une nouvelle image qu'il encode en base64 afin de l'ajouter directement au sein de votre page en replacent je favicon déjà présent.

Vous pouvez créer divers types d'animations :

  • slide
  • fade
  • pop
  • popFade
  • sans animation

Vous pouvez aussi changer sa position, sont style (rond, carré), sa couleur de fond ...

Vous pouvez aussi mettre une vidéo, ou même la webcam de votre utilisateur.

Source

Voici quelques exemples d'animations.

Slide :

var favicon=new Favico({
    animation:'slide'
});
favicon.badge(1);

Fade :

var favicon=new Favico({
    animation:'fade'
});
favicon.badge(2);

Pop :

var favicon=new Favico({
    animation:'pop'
});
favicon.badge(3);

Articles liés

Les commentaires ont été désactivés.

0 commentaire