He vist que surten floquets de neu al web de l'agora.xtec.cat. Hi ha alguna possibilitat per activar-ho als webs de Nodes? Quedaria molt divertit!!!
Gràcies!!!
He vist que surten floquets de neu al web de l'agora.xtec.cat. Hi ha alguna possibilitat per activar-ho als webs de Nodes? Quedaria molt divertit!!!
Gràcies!!!
Hola Christian!
I tant! La idea està extreta d'aquest article de Moodle, però a Nodes també és possible afegir els floquets de neu. Per fer-ho podeu seguir els passos següents:
<SCRIPT type="text/javascript"> /* Snow Fall 1 - no images - Java Script Visit http://rainbow.arch.scriptmania.com/scripts/ for this script and many more */ // Set the number of snowflakes (more than 30 - 40 not recommended) var snowmax=35 // Set the colors for the snow. Add as many colors as you like var snowcolor=new Array("#aaaacc","#ddddff","#ccccdd","#f3f3f3","#f0ffff") // Set the fonts, that create the snowflakes. Add as many fonts as you like var snowtype=new Array("Times","Arial","Times","Verdana") // Set the letter that creates your snowflake (recommended: * ) var snowletter="*" // Set the speed of sinking (recommended values range from 0.3 to 2) var sinkspeed=0.6 // Set the maximum-size of your snowflakes var snowmaxsize=30 // Set the minimal-size of your snowflakes var snowminsize=8 // Set the snowing-zone // Set 1 for all-over-snowing, set 2 for left-side-snowing // Set 3 for center-snowing, set 4 for right-side-snowing var snowingzone=1 /////////////////////////////////////////////////////////////////////////// // CONFIGURATION ENDS HERE /////////////////////////////////////////////////////////////////////////// // Do not edit below this line var snow=new Array() var marginbottom var marginright var timer var i_snow=0 var x_mv=new Array(); var crds=new Array(); var lftrght=new Array(); var browserinfos=navigator.userAgent var ie5=document.all&&document.getElementById&&!browserinfos.match(/Opera/) var ns6=document.getElementById&&!document.all var opera=browserinfos.match(/Opera/) var browserok=ie5||ns6||opera function randommaker(range) { rand=Math.floor(range*Math.random()) return rand } function initsnow() { if (ie5 || opera) { marginbottom = document.body.scrollHeight marginright = document.body.clientWidth-15 } else if (ns6) { marginbottom = document.body.scrollHeight marginright = window.innerWidth-15 } var snowsizerange=snowmaxsize-snowminsize for (i=0;i<=snowmax;i++) { crds[i] = 0; lftrght[i] = Math.random()*15; x_mv[i] = 0.03 + Math.random()/10; snow[i]=document.getElementById("s"+i) snow[i].style.fontFamily=snowtype[randommaker(snowtype.length)] snow[i].size=randommaker(snowsizerange)+snowminsize snow[i].style.fontSize=snow[i].size+'px'; snow[i].style.color=snowcolor[randommaker(snowcolor.length)] snow[i].style.zIndex=1000 snow[i].sink=sinkspeed*snow[i].size/5 if (snowingzone==1) {snow[i].posx=randommaker(marginright-snow[i].size)} if (snowingzone==2) {snow[i].posx=randommaker(marginright/2-snow[i].size)} if (snowingzone==3) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/4} if (snowingzone==4) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/2} snow[i].posy=randommaker(2*marginbottom-marginbottom-2*snow[i].size) snow[i].style.left=snow[i].posx+'px'; snow[i].style.top=snow[i].posy+'px'; } movesnow() } function movesnow() { for (i=0;i<=snowmax;i++) { crds[i] += x_mv[i]; snow[i].posy+=snow[i].sink snow[i].style.left=snow[i].posx+lftrght[i]*Math.sin(crds[i])+'px'; snow[i].style.top=snow[i].posy+'px'; if (snow[i].posy>=marginbottom-2*snow[i].size || parseInt(snow[i].style.left)>(marginright-3*lftrght[i])){ if (snowingzone==1) {snow[i].posx=randommaker(marginright-snow[i].size)} if (snowingzone==2) {snow[i].posx=randommaker(marginright/2-snow[i].size)} if (snowingzone==3) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/4} if (snowingzone==4) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/2} snow[i].posy=0 } } var timer=setTimeout("movesnow()",50) } for (i=0;i<=snowmax;i++) { document.write("<span id='s"+i+"' style='position:absolute;top:-"+snowmaxsize+"'>"+snowletter+"</span>") } if (browserok) { window.onload=initsnow } </SCRIPT>
Per treure'l quan passin festes només haureu d'esborrar aquest giny de tipus text que haureu afegit.
Una abraçada i bones festes!
Sara
Ho he fet però només surten els floquets de neu a la columna dreta però no a tota la pàgina.
http://agora.xtec.cat/esc-assis/
Hola Christian!
Què bé!
Per cert, aprofitem per fer-vos un suggeriment: si reviseu el llibre d'estil de Nodes (http://agora.xtec.cat/nodes/llibre-destil/) veureu que precisament una de les recomanacions és la d'evitar redundàncies amb les imatges de la capçalera i la resta contingut: http://agora.xtec.cat/nodes/llibre-destil/foto-carrusel/eviteu-redundancies/ Tot i que la imatge nadalenca és molt maca, potser seria convenient deixar-la només a un únic lloc
Una abraçada i bona entrada d'any!
Sara
Moltes gràcies pel suggeriment! S'agraeix!!! Qualsevol altre cosa no dubteu en comentar-la per anar millorant! Aquest curs hem fusionat web i bloc amb Nodes i hem engejat el moodle. La majoria de mestres estan publicant articles, és tot un repte per l'escola però estem molt contents perquè sembla que ho estem aconseguint!!!
Hola Christian!
Gràcies a vosaltres per tenir en compte el suggeriment! El logotip del centre encara està força redundant, però ara com a mínim no es veu la mateixa imatge dues vegades!!
Ens encanta llegir que aquest any heu posat en marxa tants projectes i que, de moment, els mestres estan publicant articles! Felicitats perquè sabem que no és fàcil!
Una abraçada i molt bona entrada d'any!
Sara
Ja he tret els floquets, com aconselleu, després de les festes. També he tret el logotip del carrusel de la portada, perquè no quedi repetitiu. He fet una imatge que juga amb els triangles, símbol de l'escola, però de manera que juga amb les tonalitats de blau que actualment tenim al Nodes. També he millorat la mida dels articles (teniem diferents mides i quedava força irregular, seleccionavem l'opció "mostra contingut sencer"), seguint els consells dels manuals de "bones pràctiques". Ho hem canviat per fotoresums, és més àgil per llegir al mòbil i al web queda més uniforme. Gràcies pels suggeriments.
Hola Agustí!
Hem estat fent algunes proves (com ara provar d'incrustar el codi a la pàgina d'inici o a algun article) i, pel que hem vist, de moment no és possible que els floquets surtin a tota la pàgina si només utilitzeu la barra a la dreta
Per cert, genial que hagueu personalitzat el colors dels flocs per adaptar-los als del disseny de la vostra pàgina!
Una abraçada i bones (i parcialment nevades) festes!
Sara
MOltes gràcies pel vostre suport. És molt agradable comptar amb un equip de persones com vosaltres que sempre, sempre esteu a resoldre els nostres dubtes, problemes i mals de cap.
Moltes gràcies per la vostra feina.
Bon any.
Agustí
Hola Agustí!
Gràcies pels teus comentaris! Ens fareu emocionar i tot!
Una abraçada enorme, bona entrada d'any i els millors desitjos pel 2016!!!!
Sara
Genial!!
Al web de l'Escola Mare de Deú de Montserrat de Súria també neva:
http://agora.xtec.cat/ceip-montserrat-suria/
Aprofito per agrair-vos la feina feta, el suport que ens doneu... i desitjar-vos a tots un FELIÇ 2016;
Fins aviat,
Rosa
Hola Rosa!
Què xulo! Ens alegra que us hagi agradat la idea!
Mil gràcies a vosaltres també per aquestes mostres d'agraïmes i feliç 2016!!
Sara
P.D.: Ara que han passat festes, recordeu-vos de treure els floquets
Torna el temps de Nadal i podem tornar a posar els floquets al nostre Nodes. He vist que hi ha alguns wordpress que tenen floquets però que no són * , són més boletes. https://ursusnatura.wordpress.com/ Sabeu com es podria fer? Gràcies!
Hola Christian,
hem trobat el mateix o un de molt semblant. Pots provar-ho posant aquest codi a un bloc HTML:
<SCRIPT type="text/javascript" src="http:
Fins ara,
Mònica
Bon dia Mònica,
Aquest codi, si volem que els floquets surtin a la portada, on s'ha de posar?
En un giny a la banda esquerra de la portada?
Fins aviat
Hola Rosa Maria,
sí, has de posar un giny HTML a la barra esquerra de portada. Si no et funciona ens ho dius i ens ho mirem.
Fins ara,
Mònica
Gràcies Mònica,
Ja neva!!! Amb el teu ajut ha estat fàcil...
http://agora.xtec.cat/ceip-montserrat-suria/
Aprofito per desitjar-vos a tots BON NADAL I MILLOR 2017,
Fins aviat,
Rosa
Molt bon Nadal també per tots vosaltres!
Fins ara,
Mònica
Hola Sara,
He provat de posar aquest codi a un bloc del moodle i en principi funciona, el problema és que ara no puc editar cap bloc de la pàgina d'inici del moodle, també tinc problemes per tancar la sessió de l'usuari, està en color gris tant una cosa com l'altra, sembla deshabilitada aquesta opció.
Salutacions,
Alfonso
No hi ha manera de que em funcioni, no acabo de saber fer-ho. HELP ME PLEASE!!!
Bon dia Josep,
Ens pots indicar l'URL del vostre Nodes? Li donarem una ullada...
Salutacions,
Isabel
Nosaltres també hem provat tots els scripts d'aquest fil i no me'n surto. Heu trobat la solució?
Merci!
Moltes gràcies.
http://agora.xtec.cat/escolacanserra/
Bon dia,
Jo també he provat de posar els floquets de neu. Crec que he posat el mateix giny de text que el curs passat, a la part esquerra de la portada. L'he posat en primer lloc...
<script src="http://rainbow.arch.scriptmania.com/scripts/bg/snowstorm.js" type="text/javascript"></script>
No em funciona! No neva!
https://agora.xtec.cat/ceip-montserrat-suria/
Ha canviat el funcionament?
Fins aviat,
Rosa
En comptes d'afegir un giny de text amb codi, heu d'anar a PERSONALITZA i he fet click a CSS additionals, enganxar el següent codi. FUNCIONA!
body {
position: relative;
}
body:before {
content: '';
display: block;
position: absolute;
z-index: 999999999999999 !important;
top: 0;
left: 0;
right: 0;
bottom: 0;
pointer-events: none;
background-image: url('https://www.dropbox.com/s/bgwuzfu83pjb5s1/divi-life-snowflakes-a-2.png?dl=1'),
url('https://www.dropbox.com/s/54le1eyh01vb253/divi-life-snowflakes-b.png?dl=1'),
url('https://www.dropbox.com/s/gfm01rozxanf3ub/divi-life-snowflakes-d.png?dl=1');
-webkit-animation: snow 15s linear infinite;
-moz-animation: snow 15s linear infinite;
-ms-animation: snow 15s linear infinite;
animation: snow 15s linear infinite;
}
@keyframes snow {
0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
100% {background-position: 500px 1000px, 200px 400px, -100px 300px;}
}
@-moz-keyframes snow {
0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
100% {background-position: 400px 1000px, 200px 400px, 100px 300px;}
}
@-webkit-keyframes snow {
0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
100% {background-position: 500px 1000px, 200px 400px, -100px 300px;}
}
@-ms-keyframes snow {
0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
100% {background-position: 500px 1000px, 200px 400px, -100px 300px;}
}
Podeu veure com neva al web del meu centre: https://agora.xtec.cat/escolacanserra/
Moltes gràcies!
Ja neva a Barberà!
Bon dia!
Moltes gràcies!!!
A Súria també ha començat a nevar!
https://agora.xtec.cat/ceip-montserrat-suria/
Moltes gràcies companys/companyes !
Ja neva al web del SE Segarra!
Sou uns/unes cracks!
Moltes gràcies Christian!!!!
Bon dia,
He provat l'opció de personalitzar el CSS amb el còdi:
body { position: relative; } body:before { content: ''; display: block; position: absolute; z-index: 999999999999999 !important; top: 0; left: 0; right: 0; bottom: 0; pointer-events: none; background-image: url('https://www.dropbox.com/s/bgwuzfu83pjb5s1/divi-life-snowflakes-a-2.png?dl=1'), url('https://www.dropbox.com/s/54le1eyh01vb253/divi-life-snowflakes-b.png?dl=1'), url('https://www.dropbox.com/s/gfm01rozxanf3ub/divi-life-snowflakes-d.png?dl=1'); -webkit-animation: snow 15s linear infinite; -moz-animation: snow 15s linear infinite; -ms-animation: snow 15s linear infinite; animation: snow 15s linear infinite; } @keyframes snow { 0% {background-position: 0px 0px, 0px 0px, 0px 0px;} 50% {background-position: 500px 500px, 100px 200px, -100px 150px;} 100% {background-position: 500px 1000px, 200px 400px, -100px 300px;} } @-moz-keyframes snow { 0% {background-position: 0px 0px, 0px 0px, 0px 0px;} 50% {background-position: 500px 500px, 100px 200px, -100px 150px;} 100% {background-position: 400px 1000px, 200px 400px, 100px 300px;} } @-webkit-keyframes snow { 0% {background-position: 0px 0px, 0px 0px, 0px 0px;} 50% {background-position: 500px 500px, 100px 200px, -100px 150px;} 100% {background-position: 500px 1000px, 200px 400px, -100px 300px;} } @-ms-keyframes snow { 0% {background-position: 0px 0px, 0px 0px, 0px 0px;} 50% {background-position: 500px 500px, 100px 200px, -100px 150px;} 100% {background-position: 500px 1000px, 200px 400px, -100px 300px;} }
Però no em deixa desar perquè diu que hi han dos errors que podrien estropear el web.
Espero la resposta abans de publicar el CSS adicional.
Gràcies i Bon Nadal a tots/es.
Hola, Alfonso,
sí, el codi de l'any passat dóna aquest error. Pots fer servir aquest: https://educaciodigital.cat/moodle/moodle/mod/forum/discuss.php?d=130868#p457194
Fins ara,
Mònica
Bon dia,
Finalment he posat aquest, però he modificat:
body { position: relative; } body:before { content: ''; display: block; position: absolute; z-index: 999999999999999 !important; top: 0; left: 0; right: 0; bottom: 0; pointer-events: none; background-image: url('https://www.dropbox.com/s/bgwuzfu83pjb5s1/divi-life-snowflakes-a-2.png?dl=1'), url('https://www.dropbox.com/s/54le1eyh01vb253/divi-life-snowflakes-b.png?dl=1'), url('https://www.dropbox.com/s/gfm01rozxanf3ub/divi-life-snowflakes-d.png?dl=1'); -webkit-animation: snow 15s linear infinite; -moz-animation: snow 15s linear infinite; -ms-animation: snow 15s linear infinite; animation: snow 15s linear infinite; } @keyframes snow { 0% {background-position: 0px 0px, 0px 0px, 0px 0px;} 50% {background-position: 500px 500px, 100px 200px, -100px 150px;} 100% {background-position: 500px 1000px, 200px 400px, -100px 300px;} } @-moz-keyframes snow { 0% {background-position: 0px 0px, 0px 0px, 0px 0px;} 50% {background-position: 500px 500px, 100px 200px, -100px 150px;} 100% {background-position: 400px 1000px, 200px 400px, 100px 300px;} } @-webkit-keyframes snow { 0% {background-position: 0px 0px, 0px 0px, 0px 0px;} 50% {background-position: 500px 500px, 100px 200px, -100px 150px;} 100% {background-position: 500px 1000px, 200px 400px, -100px 300px;} } @-moz-keyframes snow { 0% {background-position: 0px 0px, 0px 0px, 0px 0px;} 50% {background-position: 500px 500px, 100px 200px, -100px 150px;} 100% {background-position: 500px 1000px, 200px 400px, -100px 300px;} }
Gràcies i Bon Nadal a tots/es.
Gràcies per compartir-ho, Alfonso!