Under vintertider är det lite extra mysigt när det faller snö på bloggen. Om du följer instruktionerna nedan så är du några sekunder ifrån att också ha det på din blogg eller hemsida!
För er som använder wordpress:
- Installera pluginet ”Let it snow” och aktivera det. Klart!
För er som använder blogg.se eller annan plattform där du har tillgång till kodmallarna:
- Kopiera koden nedan och klistra in det ovanför </head> i ALLA kodmallar (design > redigera kodmall). Spara allting och uppdatera din webbläsare* när du har gjort ändringarna.
<script type="text/javascript">
/******************************************
* Snow Effect Script- By Altan d.o.o. (http://www.altan.hr/snow/index.html)
* Visit Dynamic Drive DHTML code library (http://www.dynamicdrive.com/) for full source code
* Last updated Nov 9th, 05' by DD. This notice must stay intact for use
******************************************/
//Configure below to change URL path to the snow image
var snowsrc="http://tescho.se/sno.png"
// Configure below to change number of snow to render
var no = 30;
// Configure whether snow should disappear after x seconds (0=never):
var hidesnowtime = 0;
// Configure how much snow should drop down before fading ("windowheight" or "pageheight")
var snowdistance = "windowheight";
///////////Stop Config//////////////////////////////////
var ie4up = (document.all) ? 1 : 0;
var ns6up = (document.getElementById&&!document.all) ? 1 : 0;
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
var dx, xp, yp; // coordinate and position variables
var am, stx, sty; // amplitude and step variables
var i, doc_width = 800, doc_height = 800;
if (ns6up) {
doc_width = self.innerWidth;
doc_height = self.innerHeight;
} else if (ie4up) {
doc_width = iecompattest().clientWidth;
doc_height = iecompattest().clientHeight;
}
dx = new Array();
xp = new Array();
yp = new Array();
am = new Array();
stx = new Array();
sty = new Array();
snowsrc=(snowsrc.indexOf("dynamicdrive.com")!=-1)? "snow.gif" : snowsrc
for (i = 0; i < no; ++ i) {
dx[i] = 0; // set coordinate variables
xp[i] = Math.random()*(doc_width-50); // set position variables
yp[i] = Math.random()*doc_height;
am[i] = Math.random()*20; // set amplitude variables
stx[i] = 0.02 + Math.random()/10; // set step variables
sty[i] = 0.7 + Math.random(); // set step variables
if (ie4up||ns6up) {
if (i == 0) {
document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><a href=\"http://dynamicdrive.com\"><img src='"+snowsrc+"' border=\"0\"><\/a><\/div>");
} else {
document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><img src='"+snowsrc+"' border=\"0\"><\/div>");
}
}
}
function snowIE_NS6() { // IE and NS6 main animation function
doc_width = ns6up?window.innerWidth-10 : iecompattest().clientWidth-10;
doc_height=(window.innerHeight && snowdistance=="windowheight")? window.innerHeight : (ie4up && snowdistance=="windowheight")? iecompattest().clientHeight : (ie4up && !window.opera && snowdistance=="pageheight")? iecompattest().scrollHeight : iecompattest().offsetHeight;
for (i = 0; i < no; ++ i) { // iterate for every dot
yp[i] += sty[i];
if (yp[i] > doc_height-50) {
xp[i] = Math.random()*(doc_width-am[i]-30);
yp[i] = 0;
stx[i] = 0.02 + Math.random()/10;
sty[i] = 0.7 + Math.random();
}
dx[i] += stx[i];
document.getElementById("dot"+i).style.top=yp[i]+"px";
document.getElementById("dot"+i).style.left=xp[i] + am[i]*Math.sin(dx[i])+"px";
}
snowtimer=setTimeout("snowIE_NS6()", 10);
}
function hidesnow(){
if (window.snowtimer) clearTimeout(snowtimer)
for (i=0; i<no; i++) document.getElementById("dot"+i).style.visibility="hidden"
}
if (ie4up||ns6up){
snowIE_NS6();
if (hidesnowtime>0)
setTimeout("hidesnow()", hidesnowtime*1000)
}
</script>
*webbläsare = mozilla firefox, internet explorer, google chrome, safari etc. För att uppdatera klickar man på F5 (pc) eller cmd + r (mac)
Edit: Det är en del som säger att det inte fungerar för dem. Jag testar alltid alla mina guider innan de publiceras. Detta testade jag senast 29/11-10 och vet att det fungerar :)
Edit 2: Jag har ändrat hur man hämtar koden och hoppas att det ska fungera bättre för alla nu.
Hej! Jag håller på och försöker fixa så att det snöar på min blogg. Men hur gör man för att det ska snöa på hela sidan, hela tiden? Just nu slutar det snöa precis innan första rubriken. Jag ser att du har på din sida att det snöar hela vägen ner och att några snö flingor till och med stannar längst ned på sidan, så det måste ju gå eller? :S Tack för en as bra sida!
Svar från Tescho: Kika in DDB:s instruktioner som jag testat och fått det att fungera: http://www.designadinblogg.se/2008/december/fallande-sno.asp
Inlägg jag har skrivit om snö i bloggen: http://tescho.se/vinterstamning/
[Svara]
Jag älskar snön som faller på din blogg! Jag skulle gärna vilja ha likadant på min blogg, för den du har är varken för mycket snö eller för lite. Jag gillar också att snön stannar längst ner på sidan. :)
Jag undrar hur man får exakt sådan snö? Jag tittade på dina tips ovanför men var inte speciellt intresserad av den typ av snö. Jag skulle vilja ha sådan snö som du som ser mer äkta ut.
Stor kram. ♥
Svar från Tescho: Om du använder wordpress så kan jag guida dig?
Svarar här eftersom du inte angett webbplats.
[Svara]
Det där fungerar inte för mig. har provat massa olika koder, klistrat in dem efter eller innan men ingenting händer. Det blir liksom en snöflinga längst upp i hörnet som inte rör sig. Är väldigt tacksam för svar, skulle gärna vilja lära mig det där med snöflingor. (:
Svar från Tescho: Hm, det enda jag kan rekommendera är att googla det :(
[Svara]
Okej, jag ska prova det då (: Tack!
[Svara]
Tack, men detta funkar inte heller. Har provat att sätta det lite här och var, men det funkar inte för mig. Känner mig väldigt efterbliven just nu ;P
Men ah, får lägga det där åt sidan. Det går inte.
[Svara]
Yes, jag har testat din, den som finns på DDB, två som finns på webdesignskolan etc. Inget funkar och jag fattar inte varför!
[Svara]
Ja, precis. Så blir det för mig också ):
Du behöver inte titta mer om du inte känner att du har tid! Tack för att du tittade lite i alla fall (:
[Svara]
hehe tack så mkt:D ska testa få hoppas det fungerar:) Ha d gött<3
[Svara]
Jag har provat aaaallt :) men de funkar inte, fick igång de med hjälp av DDB, men flingorna står bara och bråkar med varandra längst upp på bloggen. Helt sjukt!
[Svara]
Eller de bråkar i FF men inte i IE?!
[Svara]
Hejsan!
Jag har verkligen kämpat med att få snöflingor på min blogg, men få de inte att fungera. Snälla, vill du hjälpa mej?
Tycker så som du har de är perfekt. Kan du inte skriva exakt kod du har och var jag ska klistra in de?
Tack på förhand!
Kram
//terese
Svar från Tescho: I inlägget ovan har jag länkat till en zip-fil som är en kod för snö i bloggen. Läs detta inlägg igen eller spana in länkarna så ordnar du det!
[Svara]
DEt funkar inte :( jag blir så ledsen :(
jdet går inte att ha snöflingor :(
[Svara]
Tescho svarar:
25 / 11 - 08 » 00:52:21
Jag testade koden häromdagen så jag vet att det fungerar.
[Svara]
Jag testade detta nu precis. Jag la in koden i alla kodmallar ovanför . Men det kommer inte fram någon snö. Vet du om det finns något man kan göra? Är det något som kan ”ligga ivägen”?? KRam
[Svara]
Tescho svarar:
25 / 11 - 08 » 00:52:21
Gör om – gör rätt. Jag dubbelkontrollerade koden för ca en vecka sen och vet att det fungerar. Den ska inte krocka med någonting. Glöm inte att uppdatera din webbläsare :)
[Svara]
Vill inte fungera för mig heller. Klistrat in i alla kodmallar in men icke… :(
[Svara]
Tescho svarar:
25 / 11 - 08 » 00:52:21
Jag dubbelkontrollerade allting senast i förrgår så det ska fungera.. Ibland kan det ta tid när man gör ändringar i bloggdesignen men när jag testade fungerade allting på en gång..
Edit: Jag har ändrat hur man hämtar koden så jag hoppas att det ska fungera bättre nu :)
[Svara]
det fungerar inte för mig fast jag uppdaterar och gör som man ska :( får fortsätta att testa :D
[Svara]
Tescho svarar:
25 / 11 - 08 » 00:52:21
Jag dubbelkontrollerade allting senast i förrgår så det ska fungera.. Ibland kan det ta tid när man gör ändringar i bloggdesignen men när jag testade fungerade allting på en gång…
Edit: Jag har ändrat hur man hämtar koden så jag hoppas att det ska fungera bättre nu :)
[Svara]
Hej. Tack för snön =) Men det vill inte funka på min blogg. Gjort allt som står men snön vill inte komma fram. Inte vad jag ser i alla fall. Kram
[Svara]
Tescho svarar:
25 / 11 - 08 » 00:52:21
Jag dubbelkontrollerade allting senast i förrgår så det ska fungera… Ibland kan det ta tid när man gör ändringar i bloggdesignen men när jag testade fungerade allting på en gång..
Edit: Jag har ändrat hur man hämtar koden så jag hoppas att det ska fungera bättre nu :)
[Svara]
Dannielle svarar:
25 / 11 - 08 » 00:52:21
Okej, prövar att lägga in koderna igen och väntar och får se om det funkar under dagen!
Tack för tipset förresten! Förstår vilket enormt arbete du lägger ner.
[Svara]
Tescho svarar:
25 / 11 - 08 » 00:52:21
Jag har ändrat hur man hämtar koden nu. Jag hoppas att det fungerar bättre efter det :) Testa att kopiera det ”nya”.
* Linda med Cazandra * svarar:
25 / 11 - 08 » 00:52:21
Tack så mycket =) Nu funkar det =) Du gör ett helt underbart jobb. Kram Linda
[Svara]
Jag tycker att du är riktigt duktig som lägger ner så mkt energi på detta. Men jag har testat detta massa gånger nu och det funkar fortfarande inte :(
Jag testade den förra koden och den funkar inte så jag hoppades att denna skulle funkar men icke :( Fattar inte vad jag gör fel.
[Svara]
Tescho svarar:
25 / 11 - 08 » 00:52:21
Jag har testat koderna senast idag o vet att det fungerar :)
[Svara]
Nu fick jag snö på min blogg! Tack kära du för att du lägger ner tid på det här! :)
[Svara]
Hej
Härligt med snö:) finns det något sätt att få det ”snöa” hela vägen ner utan att allt faller på samma gång?
Kram
Skogstrollet
[Svara]
Tescho svarar:
25 / 11 - 08 » 00:52:21
Ska spana in det imorgon. Återkommer :)
[Svara]
Hejsan. Beundrar dig och din blogg :) Älskar dina söta hundar också!
Jag har testat detta med snön. Allting fungerar perfekt förutom att min snö bara ”slutar” helt plötsligt efter typ halva sidan :) jag tänkte om det gick att göra så som du har gjort, att snön hamnar längst ner på sidan? :) Läste igenom koden men hittade ingenting om det. Har du nåt tips? :)
Mvh Sandra.
[Svara]
Tescho svarar:
25 / 11 - 08 » 00:52:21
Tack så mycket :)
Leta i koden och se om du hittar ”height”. Där kan du justera längden. Har för mig att det ska gå att ändra det!
[Svara]
Jag har wordpress på egen domän o eget hotell (one.com)
Provat let it snow men det funkar inte..
Dessutom funkar det inte att förhandsgranska teman heller :(
Hmm, andra plugins funkar men inte detta o inte förhandsgranskningen helt plötsligt.
[Svara]
Tescho svarar:
25 / 11 - 08 » 00:52:21
Maila support, inte mig :)
[Svara]
Det funkade för mej.
TIPS TILL ER SOM DET INTE FUNKAR FÖR:
VIKTIGT!!!!!!!!!!!!!!!!!!!
PASTE KODEN PÅ ALLA SIDOR I BLOGGEN!
[Svara]
jag har en fråga , ska man kopiera ALL text som är där uppe , om man ska det så funkar det nt
har försökt med det här i timmar , de går nt :(
[Svara]
Tescho svarar:
25 / 11 - 08 » 00:52:21
Du ska kopiera hela scriptet och det fungerar. Jag använder det hela tiden till bloggdesigner.
[Svara]
lovisa svarar:
25 / 11 - 08 » 00:52:21
ok , jag är mke tacksam för hjälpen & beundrar att du orkar lägga ner så mke tid på det här , :)
[Svara]
fungerar detta på devote också? får inte till det :/
[Svara]
Tescho svarar:
25 / 11 - 08 » 00:52:21
Har för mig att man bara har tillgång till stilmallen när det gäller devote. Maila support o hör med dem :)
[Svara]
Tack så mycket för hjälpen!
[Svara]
tack äntligen en kod som fungerade för mig.
[Svara]
Hej!
Har sutttit och testat olika mallar för att fixa detta hela dagen och ingen har fungerat helt men tack vare dig har jag till slut fått det att fungera! Tack och Bock för förklaringen!
[Svara]
Tescho svarar:
25 / 11 - 08 » 00:52:21
Vad härligt att höra! Tack själv :)
[Svara]
Går det att ändra så snön faller från toppen av sidan och inte från headern? Försökte lista ut hur man gjorde men kommer inte unfund med hur man gör :(
[Svara]
Tescho svarar:
25 / 11 - 08 » 00:52:21
Ja då, google it :)
[Svara]
Hej!
Fattar inte hur man fixar snöflingor på wordpress …
[Svara]
Tescho svarar:
25 / 11 - 08 » 00:52:21
Lägger till tillägget ”let it snow”
[Svara]
hej tack. det funkade! ;) unrade bara hur du gjorde så att du fick en rörande bild i headern? puss astrid
[Svara]
Tescho svarar:
25 / 11 - 08 » 00:52:21
Det är en GIF-animation.
[Svara]
Hej!
Jag använder devote.se men vet ej hur jag ska göra för att det ska snöa på bloggen=(
Kan du hjälpa mig?
PS. ÄLSKAR din blogg.DS
[Svara]
Tescho svarar:
25 / 11 - 08 » 00:52:21
Mejla support. Tack!
[Svara]