Ouvrir une demande d'aide
Derniers sujets
» Visites de l'admin
Jeu 16 Nov 2017, 19:52 par Singleton

» Présentation des membres
Lun 10 Avr 2017, 15:10 par Singleton

» Bonnes fêtes de fin d'année !
Jeu 05 Jan 2017, 03:22 par Derri

» Changements dans le Staff
Dim 30 Oct 2016, 22:46 par Kiyomizu

» Sur les moteurs de recherche
Mar 30 Aoû 2016, 14:03 par Alicia Hopeful

» Date d’un article sur un blog
Lun 27 Juin 2016, 19:50 par Gérard du 07

» achat de crédits défectueux
Mer 11 Mai 2016, 12:33 par Nicoape

» Intégration d'un sondage sur le blog
Mer 27 Avr 2016, 20:40 par Nicoape

» Articles apparaissant dans la partie module
Mer 27 Avr 2016, 11:06 par Nicoape

» (#2105): Problème d'affichage des commentaires
Sam 16 Avr 2016, 19:34 par Singleton

Les posteurs les plus actifs du mois
Passiflore
 
Singleton
 

Qui est en ligne ?
Il y a en tout 15 utilisateurs en ligne :: 0 Enregistré, 0 Invisible et 15 Invités :: 1 Moteur de recherche

Aucun

[ Voir toute la liste ]


Le record du nombre d'utilisateurs en ligne est de 183 le Mar 16 Juil 2013, 12:37

Mettre une pluie d'image sur son blog

Voir le sujet précédent Voir le sujet suivant Aller en bas

Astuce Mettre une pluie d'image sur son blog

Message par Singleton le Ven 08 Juin 2012, 13:05

Mettre une pluie d'image sur son blog


Ce tutoriel vise à vous montrer comment ajouter une pluie d'images de votre choix

Mettre le script

Allez dans votre Panneau d'administration ›› MultiBlog ›› Module ›› Module personnalisé et ajoutez le code suivant dans votre module et ayant pris soit de mettre un titre à votre module sans quoi, il ne s'affichera pas !

Code:
<script type="text/javascript">
var speed=20; // Vitesse désirée
var flakes=20; // Nombre d'images désirées
var flake_image="http://url de l'image.png"; //
var swide, shigh;
var dx=new Array();
var xp=new Array();
var yp=new Array();
var am=new Array();
var sty=new Array();
window.onload=function() { if (document.getElementById) {
var k, f, b;
b=document.createElement("div");
b.style.position="absolute";
b.setAttribute("id", "bod");
document.body.appendChild(b);
set_scroll();
set_width();
for (var i=0; i<flakes; i++) {
dx[i]=0;
am[i]=Math.random()*20;
xp[i]=am[i]+Math.random()*(swide-2*am[i]-25);
yp[i]=Math.random()*shigh;
sty[i]=0.75+1.25*Math.random();
f=document.createElement("div");
f.style.position="absolute";
f.setAttribute("id", "flk"+i);
f.style.zIndex=i;
f.style.top=yp[i]+"px";
f.style.left=xp[i]+"px";
k=document.createElement("img");
k.src=flake_image;
f.appendChild(k);
b.appendChild(f);
}
setInterval("winter_snow()", speed);
}}
window.onresize=set_width;
function set_width() {
if (document.documentElement && document.documentElement.clientWidth) {
swide=document.documentElement.clientWidth;
shigh=document.documentElement.clientHeight;
}
else if (typeof(self.innerHeight)=="number") {
swide=self.innerWidth;
shigh=self.innerHeight;
}
else if (document.body.clientWidth) {
swide=document.body.clientWidth;
shigh=document.body.clientHeight;
}
else {
swide=800;
shigh=600
}
}
window.onscroll=set_scroll;
function set_scroll() {
var sleft, sdown;
if (typeof(self.pageYOffset)=="number") {
sdown=self.pageYOffset;
sleft=self.pageXOffset;
}
else if (document.body.scrollTop || document.body.scrollLeft) {
sdown=document.body.scrollTop;
sleft=document.body.scrollLeft;
}
else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
sleft=document.documentElement.scrollLeft;
sdown=document.documentElement.scrollTop;
}
else {
sdown=0;
sleft=0;
}
document.getElementById("bod").style.top=sdown+"px";
document.getElementById("bod").style.left=sleft+"px";
}
function winter_snow() {
for (var i=0; i<flakes; i++) {
yp[i]+=sty[i];
if (yp[i]>shigh-30) {
xp[i]=am[i]+Math.random()*(swide-2*am[i]-25);
yp[i]=0;
sty[i]=0.75+1.25*Math.random();
}
dx[i]+=0.02+Math.random()/10;
document.getElementById("flk"+i).style.top=yp[i]+"px";
document.getElementById("flk"+i).style.left=(xp[i]+am[i]*Math.sin(dx[i]))+"px";
}
}
</script>

Puis il vous suffit de modifier les 3 premières lignes du script à votre guise:

Code:
var speed=20; // Vitesse désirée
var flakes=20; // Nombre d'images désirées
var flake_image="http://url de l'image.png"; //

Aperçu avec l'image


Ce tutoriel a été rédigé par le Staff du Forum des Blogs,
Et en particulier par Wave.

Aucune reproduction possible sans notre accord, conformément à l’article L122-1 du CPI.


Cordialement,


avatar
Singleton
Adminblog
Adminblog

Masculin
Messages : 1540

http://forum.forumactif.com/u134151

Revenir en haut Aller en bas

Voir le sujet précédent Voir le sujet suivant Revenir en haut


 
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum