Comme toujours je fais un tour sur le blog de dadou3x pour voir ce qu’il y avait d’intéressant et pour laisser un commentaire c’est là que je suis tombé sur un commentaire qui parlé d’un script js du nom de Glossy.js qui avait l’air vraiment utile surtout dans le cas ou vous n’avez pas beaucoup de temps ou que vous n’aimez pas trop le traitement des images c’est possible aussi :)
Ce script Js vous permet d’avoir un effet glace à la web 2.0, tout ce qu’il faut : image arrondie ainsi qu’un ombrage.
Donc j’ai décidé de faire un petit tutorial pour vous expliquer comment faire l’ajout et son paramétrage.
Premier partie : Ajout du Js Glossy.js dans votre site ou blog.
Téléchargez et placez le fichier Glossy.js dans votre répertoire racine par exemple, ensuite ajoutez la balise qui va faire appel à ce script entre <head> et </head> :
<script type="text/javascript" src="glossy.js"></script>Bien sûr faites attention au paramètre “src” qui indique l’emplacement du script.
Deuxième partie : Ajout de la class à votre image pour afficher l’effet
<img src="images/example.jpg" width="300" height="202" class="glossy" />Paramétrage du style :
Pour changer le style d’arrondi pour l’image il faut ajouter et paramétrer la valeur “iradius25″ - min=20 max=50 par défaut =25
Pour enlever l’ombrage de l’image ajoutez le valeur “noshadow”. Par défaut l’ombrage est active pour l’image.
<img src="images/example.jpg" width="300" height="202" class="glossy noshadow" /><Dans le site officiel vous trouvez d’autre d’informations sur ce script ainsi que d’autres scripts tel que corner.js; qui va vous permettre d’appliquer d’autres effets sur vos images.
N’hésitez pas à me laisser des commentaires après vos essais.
Jeu de briques
Snake
Pacman
Bubble