Paperbulle

Paperbulle est un module javascript basé sur la librairie PaperJS. Il permet à l'aide d'un canvas de générer un fond de site à base de bulles. Une option permet de le transformer en lampe à lave. En outre, le panneau de configuration permet de gérer la couleur des bulles, leur transparence, et d'autres options graphiques.

Paperbulle Paperbulle
Voir la création
(un nouvel onglet va s'ouvrir)

Initialisation <body>
<script src="jquery-1.11.0.js"></script>
<script src="paper-full.min.js"></script>
<script type="text/paperscript" src="paperbulle2.js" canvas="myCanvas"></script>
<canvas id="myCanvas" resize></canvas>
</body>
Détail des options (contenu dans paperbulle2.js) Taille des bulles dmini Diamètre minimum des bulles en pixel. dmaxi Diamètre maximum des bulles en pixel. Couleur des bulles colorR colorG colorB Au format RGB [0-255]. Animation setbulle Nombres de bulles. vitesse Vitesse de l'animation : plus le chiffre est faible plus l'animation est rapide. Effet des bulles randomizecolor Booléen, active l'aléatoirisation de la couleur des bulles, by pass sur les précédents paramètre RGB. alpha Booléen, active la transparence des bulles. setalpha Définit la transparence (0.1 à 1). alpharandom Booléen, active la transparence aléatoire, désactive le setalpha. shadowfx Booléen, active un ombré autour des bulles. Effet de disparition des bulles setfading Booléen, activation de la disparition progressive des bulles en atteignant le haut du canvas. fadingheight Limite de la disparition depuis le haut de la page en pixel. canvasBGcolorR canvasBGcolorG canvasBGcolorB Format RGB [0-255], définit la couleur de fond et la couleur du fader : obligatoire si fading activé. Profondeur de champs setfocus Booléen, active un effet de profondeur de champs. Lampe à lave lavalamp Booléen, active l'effet lampe à lave. lavalimit Définit la hauteur de la limite de la lave depuis le bas du canvas en pixel. Nom des éléments idcontent String, id du canvas.