-
Poussière d'étoiles
qu'est-ce que c'est ?
Cliquez sur le lien ci-dessous pour avoir un aperçu.
http://ekladata.com/acM8DqWhNTDJcjIvIoc0Fi4gPXo/etoile.htmlcomment faire ?
Pour commencer, vérifiez bien que le Javascript soit activé sur votre compte.
S'il ne l'est pas, vous pouvez en obtenir l'activation en envoyant un message à Stéphanie.
Donc, pour appliquer ce petit effet, il faut créer un module simple et ajouter dans l'emplacement réservé à son HTML le code ci-dessous :<script type="text/javascript">
// <![CDATA[
var colour="#FFFFFF";
var sparkles=70;
var x=ox=400;
var y=oy=300;
var swide=800;
var shigh=600;
var sleft=sdown=0;
var tiny=new Array();
var star=new Array();
var starv=new Array();
var starx=new Array();
var stary=new Array();
var tinyx=new Array();
var tinyy=new Array();
var tinyv=new Array();
window.onload=function() { if (document.getElementById) {
var i, rats, rlef, rdow;
for (var i=0; i<sparkles; i++) {
var rats=createDiv(3, 3);
rats.style.visibility="hidden";
document.body.appendChild(tiny[i]=rats);
starv[i]=0;
tinyv[i]=0;
var rats=createDiv(5, 5);
rats.style.backgroundColor="transparent";
rats.style.visibility="hidden";
var rlef=createDiv(1, 5);
var rdow=createDiv(5, 1);
rats.appendChild(rlef);
rats.appendChild(rdow);
rlef.style.top="2px";
rlef.style.left="0px";
rdow.style.top="0px";
rdow.style.left="2px";
document.body.appendChild(star[i]=rats);
}
set_width();
sparkle();
}}
function sparkle() {
var c;
if (x!=ox || y!=oy) {
ox=x;
oy=y;
for (c=0; c<sparkles; c++) if (!starv[c]) {
star[c].style.left=(starx[c]=x)+"px";
star[c].style.top=(stary[c]=y)+"px";
star[c].style.clip="rect(0px, 5px, 5px, 0px)";
star[c].style.visibility="visible";
starv[c]=50;
break;
}
}
for (c=0; c<sparkles; c++) {
if (starv[c]) update_star(c);
if (tinyv[c]) update_tiny(c);
}
setTimeout("sparkle()", 40);
}
function update_star(i) {
if (--starv[i]==25) star[i].style.clip="rect(1px, 4px, 4px, 1px)";
if (starv[i]) {
stary[i]+=1+Math.random()*3;
if (stary[i]<shigh+sdown) {
star[i].style.top=stary[i]+"px";
starx[i]+=(i%5-2)/5;
star[i].style.left=starx[i]+"px";
}
else {
star[i].style.visibility="hidden";
starv[i]=0;
return;
}
}
else {
tinyv[i]=50;
tiny[i].style.top=(tinyy[i]=stary[i])+"px";
tiny[i].style.left=(tinyx[i]=starx[i])+"px";
tiny[i].style.width="2px";
tiny[i].style.height="2px";
star[i].style.visibility="hidden";
tiny[i].style.visibility="visible"
}
}
function update_tiny(i) {
if (--tinyv[i]==25) {
tiny[i].style.width="1px";
tiny[i].style.height="1px";
}
if (tinyv[i]) {
tinyy[i]+=1+Math.random()*3;
if (tinyy[i]<shigh+sdown) {
tiny[i].style.top=tinyy[i]+"px";
tinyx[i]+=(i%5-2)/5;
tiny[i].style.left=tinyx[i]+"px";
}
else {
tiny[i].style.visibility="hidden";
tinyv[i]=0;
return;
}
}
else tiny[i].style.visibility="hidden";
}
document.onmousemove=mouse;
function mouse(e) {
set_scroll();
y=(e)?e.pageY:event.y+sdown;
x=(e)?e.pageX:event.x+sleft;
}
function set_scroll() {
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;
}
}
window.onresize=set_width;
function set_width() {
if (typeof(self.innerWidth)=="number") {
swide=self.innerWidth;
shigh=self.innerHeight;
}
else if (document.documentElement && document.documentElement.clientWidth) {
swide=document.documentElement.clientWidth;
shigh=document.documentElement.clientHeight;
}
else if (document.body.clientWidth) {
swide=document.body.clientWidth;
shigh=document.body.clientHeight;
}
}
function createDiv(height, width) {
var div=document.createElement("div");
div.style.position="absolute";
div.style.height=height+"px";
div.style.width=width+"px";
div.style.overflow="hidden";
div.style.backgroundColor=colour;
return (div);
}
// ]]>
</script>Le #FFFFFF correspond à la couleur des étoiles, vous pouvez modifier celle-ci à votre guise en remplaçant ce code par le code héxadécimal de la couleur qui vous convient.
-
Commentaires
61KuraïMercredi 21 Août 2013 à 00:45Il faut en faire la demande. Tu peux en demander l'activation en envoyant un message à Stéphanie. C'est écrit au début du tutoriel et il y a un lien qui renvoie vers le profil de Stéphanie. :)
Cela me paraît un peu difficle, je ne suis pas une professionnelle du language Javascript alors je ne prendrais pas de risque en créeant un dysfonctionnement dans le code mais je ne sais vraiment pas s'il y a un moyen d'accélerer le temps de chute des étoiles, je suis désolée de ne pas pouvoir t'aider plus que ça. Cela dit, le code proposé est plutôt bien fait et je ne pense pas que cela soit une nécéssité de changer ce paramètre-là. :)
Je m'excuse une nouvelle fois !Mon javascript est activé, j'ai mis le code dans htlm d'un module simple est pourtant rien...comment sa se fait?
ah!faut activer javascript!mais j'ai deja envoyé un msg a stéphanie et elle m'a pas répondu!(mais c'était pour autre chose pas ca)
Je ne peux pas activer ton Javascript, toi seul peut le faire en le demandant.
Tu dois demander son activation en envoyant un message à StéphanieMDR comment il est long 0.o !
Si je te mets la perm 3 est-ce que tu peux me le faire :
-m'activer javascript
- et me mettre le code stp ?
merci d'avance ;3
AH MAGAAAAASH MAIS C'EST IMMEEEEEEEEENSE !!!!!!!!!!!! Bref, merci beaucoup pour ça, j'le cherchais depuis longtemps ^^'
Mais y'a pas un moyen de le faire en vachement moins long -w- ? Parce que franchement, c'est du délire juste pur ces petites étoiles ^^'
Tu peux me le faire si je te mets une perm ? Car j'y arrive pas !
Pourtant, jai activé javascript, j'ai ajouté le code dans la partie HTML d'un module, et je n'ai pas de curseur personnalisé !
Si tu es ok je te mets une perm !?
Attend, tu n'as pas répondu à ça Tu as bien mis le code dans'un module ? Tu l'as bien collé dans la partie HTML ?. Si c'est le cas et que ça ne marche toujours pas alors tu peux me mettre une permission.
Le Javascript est activé ? Tu as bien mis le code dans'un module ? Tu l'as bien collé dans la partie HTML ? Tu n'as pas de curseur personnalisé ?
Le Javascript, oui, aucun problème. Mais j'ai pas compris ce que tu veux dire pour mettre le "curseur" ? Il faut savoir que l'on ne peut pas mettre un curseur personnalisé et installer ce code en même temps car le code ne marchera pas.
Ah, oui c'est etrange.
Je peux aller voir si tu veux, j'ai du temps alors ne sois pas embêtée. ^-^
(chachamanga c'est bon pour toi bien sur.)Ah, je crois que je sais pourquoi ca ne marche pas.
Dans la fenetre d'édition du module il faut bien penser à cliquer sur le bouton HTML et coller le code dans cette fenêtre.-J'ai enlever mon curseur personnalisé
-J'ai activé mon Javascript
-J'ai fait ce qui était écrit
Et voila, ça ne marche pas comme d'habitude >O<
ça doit être enervant pour toi de tout mettre ! C'est pour ça que je n'ôse pas de te le demander =.=
je t'ai mis une perm sur mon blog (http://chachafan2manga.shojoblog.com/)
est-ce que tu pourrai me le faire stp??
Est ce que je pourrai te mettre une perm 3 pour que tu me fasses la poussière d'étoile stp ??
merci d'avance !
ps: je te mets la perm après avoir eu ta confirmation =D
mikuru j'aimerai des poussières d'étoiles sur ce blog: http://avatardenaka.eklablog.com/ je te mets la perm ok?
C'est bizzare tout ça, je ne vois pas pourquoi ca ne marcherait pas si toutes les conditions dont respectées. sanagirl tu ne m'as pas mise la permission car je n'arrive pas a accéder a ton blog.
Si vous souhaitez que je passe voir pour les autres blogs aussi n'hésitez pas.Je l'ai bien mis en code HTML, mais sa ne marche pas, je n'ai pas de mis de curseur et même mon Javascript et activé...je ne comprend pas...
@ Naka-sama : Le code c'est tout ce qui est en noir.
@ chachamanga : Peut-être que tu as deja un curseur personnalisé, ce qui expliquerait pourquoi cela ne fait pas de poussière d'étoiles. Il faut un curseur standard pour que cela fonctionne.Si j'en crois la réponse sur le forum, j'ai mon javascript activé mais ça ne marche pas ...
Peut-être car j'ai déjà mis un autre curseur ?Vous devez être connecté pour commenter
Pourquoi ça ne marche pas avec moi ?