O inverno está aqui, e muitos espaços de blog adicionaram flocos de neve, então fui ver o efeito deles. Existem vários códigos de efeito, então eu os assumi. Amigos necessitados podem assumi -los e experimentá -los.
Big Snowflake Pictures:
Código de efeito 1
<script type = "text/javascript" idioma = "javascript"> (function () {function k (a, b, c) {if (a.addeventListener) a.addeventListener (b, c, false); else a.attachevent && a.attach ("em" + b, c)} function g (a) {a) {a). a; else {var b = window.onload; window.onload = function () {b (); a ()}}} função h () {var a = {}; para (digite {top: "", esquerda: "}}) {var = tipo ==" top "? "Undefinido") A [type.TolowerCase ()] = Window ["Page" + B + "Offset"]; else {b = document.documentElement.clientHeight? window.innerHeight; else if (a.parenteLement.clientHeight) b = a.parenteLement.clientHeight; else if (a && a.clientHeight) b = a.clientHeight; retorna b} função i (a) {this.Parent = document.body; Math.Round (this.size) + "px"; this.el.style.Height = Math.Round (this.size) + "px"; this.maxleft = document.body.offsetWidth - this.Sexe; Math.RandomMom = Document.Body.BodySethEight - this.size; 1; this.angnAnge = 1,4 + 0,2 * Math.Random (); this.Minangle = 1.4; this.maxangle = 1.6; this.anDledelta = 0,01 * math.random (); this.speed = 2 + math.random ()} var j = false (function () {j = true}); {var c = [], m = setInterval (function () {f && b> c.Length && Math.random () <b * 0,0025 && c.push (novo i (a)); ! f &&! C.Length && ClearInterval (m); para (var e = h (). topo, n = l (), d = c.Length-1; d> = 0; d-) se (c [d]) se (c [d] .top <e || c [d] .top + c [d] .size + 1> e + n) {c [c]. null; c.splice (d, 1)} else {c [d] .move (); c [d] .draw ()}}, 40); k (janela, "roll", function () {for (var e = c.Length-1; e> = 0; e-) C [e] .draw ()})} g (function) (function). b)})}; window.removesnow = function () {f = false}; i.prototype = {createel: function (a, b) {this.el = document.createElement ("img"); this.el.setattribute ("src", b + "" link de link de snowflake picture; "absoluto"; this.el.style.display = "block"; this.el.style.zindex = "99999"; this.parent.appendChild (this.el)}, move: function () {if (this.ange <this.minangle | this.anDledelta; this.left += this.speed * math.cos (this.angle * math.pi); this.top -= this.speed * Math.sin (this.anGlan * Math.pi); if (this.left <0) this.left = this.maxleft; sen »), this.left <0) this.left = this.Maxleft; sen. {this.el.style.top = math.round (this.top) + "px"; this.el.style.left = math.round (this.left) + "px"}, remover: function () {this.parent.RemoveChild (this.el); this.Parent = this.el = null}Copie e cole o código acima diretamente no arquivo de cabeçalho ou rodapé no tópico. Se você apenas deseja que a página do artigo seja exibida, adicione -a diretamente ao single. Abaixo, forneceremos a você a imagem do floco de neve (material necessário). Pequena imagem: você precisa enviá -lo para o tópico atual do seu blog e alterar o link no código para o local da imagem. O efeito é como mostrado nesta página.
Código de efeito 2:
<html> <head> <cript> função start () {var Array = new Array (); var Canvas = document.getElementById ("mycanvas"); var context = canvas.getContext ("2d"); para (var i = 0; i <50; i ++) {var shownow = shownow (); array.push (mostranow);} time = setInterval (function () {context.clearRect (0,0, canvas.width, canvas.Height); para (var i = 0; i <Array.length; i ++) {array [i] .Move (); mostranow () {var y = parseint (math.random ()*50)*10; var x = parseint (math.random ()*80)*10; this.draw = function (context) {context.font = "50px Calibri "; context.fillText ("*", x, y);} this.move = function () {y+= 20; if (y> 600) {y = 0;}}} </script> </head> <body> <body type =" "value" start "oncl =" start () "/> <br> <brod> <body type =" "walut =" start "oncling =" start () "/>"/> Azul "> </lvas> </body> </html>Este efeito é demonstrado da seguinte maneira (parece feio, não recomendado):
Código de efeito três
De fato, se você implementar o blog WordPress, também poderá usar o plug-in Let It Snow.
Não vou falar sobre como usar o Let It Snow Plug-in aqui. Não é diferente de outras instalações de plug-ins. Você pode fazer o download diretamente e fazer upload dos arquivos na pasta Deixe-o nevar no/wp-content/plugins/diretório e ativar esse plug-in e definir o plug-in no menu do painel de gerenciamento do WordPress. Ou pesquise diretamente na biblioteca plug-in na parte traseira, você também pode encontrá-la.
Deixe o site oficial da Snow: clique para visitar
Código de efeito quatro
Eu já vi um plug -in de tempestade de neve muito poderoso online. É tão incrível que parece que o código para pesquisar Let It Snow no Google terá efeitos de neve e geada, o que é muito criativo. Se você acha que tem um bom lugar para crianças, pode ir ao site oficial sozinho.
Encontrei um código de efeito de queda de floco de neve aleatório simples on -line para compartilhar com você (esse efeito é escrito em código puro. Os flocos de neve são *.):
Algumas funções são explicadas brevemente:
1. Letitsnow ()
Está nevando (esta frase ainda é inútil). Então o CreateSnow é chamado para gerar flocos de neve.
2.
Cada tag de floco de neve é uma <i> e uma "*" é colocada dentro para simular os flocos de neve (a cópia do Google não pode ser baixada, na verdade mostra como um espaço, eu fiz um sol ...) e depois o coleciona em um grande recipiente chamado Snowbox, e os indivíduos gerados são empurrados para o iarray para colecioná -lo. Os flocos de neve usam o método de posicionamento absoluto com a Snowbox como referência. O topo é 0px e a esquerda usa math.random ()*window.screen.width para permitir que os flocos de neve sejam gerados aleatoriamente na largura da tela.
Use a cor para controlar a profundidade da cor dos flocos de neve para gerar profundidade de campo, variando de 0 a 200
Use o FontSize para controlar o tamanho dos flocos de neve, variando de 10px a 15px
Use o tempo para controlar o intervalo de chamadas de flocos de neve caindo, variando de 40ms a 50ms
Use SnowInterval para controlar o intervalo de geração de floco de neve, variando de 500ms a 1000ms
Então a chamada recursiva em si é chamada e os flocos de neve são constantemente gerados.
3. FALLDOWN ()
Como o nome sugere, significa que os flocos de neve caem, com uma velocidade de 2px, o que significa que cada queda vertical é de 2px. Neste momento, faça um teste. Se os flocos de neve caem em uma altura fixa, que é maior que o recipiente pai, remova -o. Isso pode reduzir a pressão no navegador. Caso contrário, muitos flocos de neve farão com que o navegador seja mais mais lento. De qualquer forma, está transbordante: escondido e não pode vê -lo, e está limpo se você não o vir. Em seguida, chame uma função de vento enquanto desce verticalmente para tornar os flocos de neve mais artísticos.
4. Windblow ()
Um nome parece estar soprando pelo vento, mas na verdade é o efeito do sopro de vento (isso é ainda mais inútil. Haha.). Use um Math.sin () para produzir o efeito dos flocos de neve flutuando no ar, para que os flocos de neve não caam de maneira monótona, mas cairão em forma de cobra, controlam o intervalo de queda, para que a continuidade seja melhor e pareça mais confortável.
function letitsnow () {var snowbox = document.getElementById ("snowbox"); var iarray = new Array (); cria (snowbox, iarray);} função desbotada (timebj, meatray) {var speed = 2; var top = parseInt (tesebj.style.top) se; pressão do navegador para (var i = 0; i <iarray.length; i ++) {if (temobj == iarray [i]) {iarray.splice (i, 1); varbox = document.getElementById ("neve"); Snowbox.RemoVechild (temobj); retorno false;}}}}}}}}}}}}}}}}}}}}} Wind = Windblow (temobj, topo); temobj.style.left = parseint (temobj.style.left)+vento*2+"px";} função windblow (temobj, topo) {if (parseInt (math.random ())%2 == 1) retorn.sin (16); CreateSnow (Snowbox, Iarray) {var temobj = document.createElement ("i"); var temtext = document.createTextNode ("*"); temobj.appendchild (temtext); temobj.style.left = parseint (math.random ()*window.screen.width)+"px"; temobj.style.top = "0px"; var temnum = parseint (math.random ()*200); temobj.style.color = "#"+temnum.toString (16)+temnum.tostring (16)+temnum.toString (16)+temnum.tostring (16); temnum = 0; while (temnum <10) {temnum = parseint (math.random ()*15);} temobj.style.fontsize = temnum+"px"; var time = 0; enquanto (tempo <40) {time = parseInt (math.random ()*50);} temobj.timer = setInterval (function () {Falldown (temobj, iarray);}, tempo); var snowinterval = 0; while (snowinterval <500) {Snowinterval = parsent (math.random (); createTimer = setTimeout (function () {CreateSnow (Snowbox, Iarray); ClearTimeout (createTimer);}, snowinterval);}Endereço da demonstração: http://demo.vevb.com/js/2014/snow/
OK, os quatro códigos de efeito terminam aqui. Espero que possa ajudar os amigos necessitados. Se você tiver alguma dúvida, deixe uma mensagem abaixo.