html圣诞节网页制作,圣诞节快乐——为你的网页添加一个可爱的HTML5圣诞节雪人！...

//底层共用

var iBase = {

Id: function(name){

return document.getElementById(name);

},

//设置元素透明度,透明度值按IE规则计,即0~100

SetOpacity: function(ev, v){

ev.filters ? ev.style.filter = 'alpha(opacity=' + v + ')' : ev.style.opacity = v / 100;

}

}

//淡入效果(含淡入到指定透明度)

function fadeIn(elem, speed, opacity){

/*

* 参数说明

* elem==>需要淡入的元素

* speed==>淡入速度,正整数(可选)

* opacity==>淡入到指定的透明度,0~100(可选)

*/

speed = speed || 20;

opacity = opacity || 100;

//显示元素,并将元素值为0透明度(不可见)

elem.style.display = 'block';

iBase.SetOpacity(elem, 0);

//初始化透明度变化值为0

var val = 0;

//循环将透明值以5递增,即淡入效果

(function(){

iBase.SetOpacity(elem, val);

val += 5;

if (val <= opacity) {

setTimeout(arguments.callee, speed)

}

})();

}

//淡出效果(含淡出到指定透明度)

function fadeOut(elem, speed, opacity){

/*

* 参数说明

* elem==>需要淡入的元素

* speed==>淡入速度,正整数(可选)

* opacity==>淡入到指定的透明度,0~100(可选)

*/

speed = speed || 20;

opacity = opacity || 0;

//初始化透明度变化值为0

var val = 100;

//循环将透明值以10递减,即淡出效果

(function(){

iBase.SetOpacity(elem, val);

val -= 10;

if (val >= opacity) {

setTimeout(arguments.callee, speed);

}else if (val < 0) {

//元素透明度为0后隐藏元素

elem.style.display = 'none';

}

})();

}

function DispMagicEmot(MagicID,H,W){

fadeIn(document.getElementById('MagicFace'), 20, 100);

MagicFaceUrl = "https://www.arefly.com/wp-content/themes/weisaysimple/includes/christmas.html";

document.getElementById("MagicFace").innerHTML = '';

//document.getElementById("MagicFace").style.top = (document.body.scrollTop+((document.body.clientHeight-300)/2))+"px";

//document.getElementById("MagicFace").style.left = (document.body.scrollLeft+((document.body.clientWidth-480)/2))+"px";

//document.getElementById("MagicFace").style.top = (window.screen.availHeight-300)/2+"px";

//document.getElementById("MagicFace").style.left = (window.screen.availWidth-480)/2+"px";

document.getElementById("MagicFace").style.bottom = (H+50)+"px";

document.getElementById("MagicFace").style.right = (W-50)+"px";

document.getElementById("MagicFace").style.visibility = 'visible';

MagicID += Math.random();

setTimeout(fadeOut(document.getElementById('MagicFace'), 1000, 0), 10000);

NowMeID = MagicID;

}

DispMagicEmot(144,370,500);