HTML是一種用于創(chuàng)建網(wǎng)頁(yè)的標(biāo)記語(yǔ)言，通過(guò)HTML可以創(chuàng)造出各種豐富多彩的效果。
如果你想在自己的網(wǎng)頁(yè)上添加一些冬季氣息，可以嘗試在頁(yè)面上添加雪花效果。
接下來(lái)，我們就來(lái)學(xué)習(xí)一下如何使用HTML代碼來(lái)實(shí)現(xiàn)頁(yè)面雪花效果。
<!DOCTYPE html><html><head><script>// 定義雪花的數(shù)量
var snowmax=50;
// 定義雪花的形狀
var snowletter="*";
// 定義雪花的速度
var sinkspeed=1;
// 定義雪花的大小
var snowsize=40;
// 定義雪花的顏色
var snowcolor=new Array("#AAAACC","#DDDDFF","#CCCCDD","#F3F3F3","#F0FFFF");
// 定義雪花的位置
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/);
function randommaker(range) {
rand=Math.floor(range*Math.random());
return rand;
}
function initsnow() {
if (ie5 || opera) {
marginbottom = document.body.clientHeight;
marginright = document.body.clientWidth;
}
else if (ns6) {
marginbottom = window.innerHeight;
marginright = window.innerWidth;
}
var snowsizerange=snowsize-10;
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.createElement("span");
snow[i].innerHTML=snowletter;
snow[i].style.position="absolute";
snow[i].style.color=snowcolor[randommaker(snowcolor.length)];
snow[i].style.fontSize=snowsize-range+randommaker(snowsizerange);
snow[i].style.zIndex=1000;
document.body.appendChild(snow[i]);
}
movesnow();
}
function movesnow() {
for (i=0;i<=snowmax;i++) {
crds[i] += x_mv[i];
snow[i].style.top=crds[i]+"px";
snow[i].style.left =lftrght[i] + Math.sin(crds[i]) + "px";
if (crds[i]>marginbottom || parseInt(snow[i].style.left)>(marginright-3*lftrght[i])) {
snow[i].style.visibility="hidden";
snow[i]=null;
snow[i]=document.createElement("span");
snow[i].innerHTML=snowletter;
snow[i].style.position="absolute";
snow[i].style.color=snowcolor[randommaker(snowcolor.length)];
snow[i].style.fontSize=snowsize-8+randommaker(6);
snow[i].style.zIndex=1000;
document.body.appendChild(snow[i]);
crds[i]=0;
lftrght[i]=Math.random()*15;
x_mv[i]=0.03+Math.random()/10;
}
}
timer=setTimeout("movesnow()",50);
}
window.onload=initsnow;
</script></head><body></body></html>使用以上代碼，您可以輕松地為您的網(wǎng)頁(yè)添加雪花效果，讓您的頁(yè)面更加炫酷和有趣。