需要做一个在页面的飘雪的效果,想添加个对象到舞台上,但是死活添加不上。
我先创建了一个div标签,定义属性id为snow,样式在样式表里定义了一个边框,在div里加入一个图片(雪花),然后添加这个节点,就是不成功,在FF里还有个边框能显示,IE6什么都没有。
<script>
var mysnow=document.createElement('div');
mysnow.setAttribute("id","snow");
mysnow.innerHtml="<div id='snow'><img src='images/ANT.GIF' /></div>";
alert(mysnow.innerHtml);
document.documentElement.appendChild(mysnow)
</script>
求指点!!
我先创建了一个div标签,定义属性id为snow,样式在样式表里定义了一个边框,在div里加入一个图片(雪花),然后添加这个节点,就是不成功,在FF里还有个边框能显示,IE6什么都没有。
<script>
var mysnow=document.createElement('div');
mysnow.setAttribute("id","snow");
mysnow.innerHtml="<div id='snow'><img src='images/ANT.GIF' /></div>";
alert(mysnow.innerHtml);
document.documentElement.appendChild(mysnow)
</script>
求指点!!
var mysnow=document.createElement('div')
mysnow.setAttribute("id","snow");
mysnow.innerHtml="<img src='images/ANT.GIF' />";
alert(mysnow.innerHtml);
document.documentElement.appendChild(mysnow);
</script>我这样试了,但是没有效果,
try{
var mySnow = document.createElement("IMG");
var __ = this; mySnow.src = this.source;
with (mySnow.style) {
width = __.width + "px";
height = __.height+ "px";
position = "absolute";
!! + "\v1" && (opacity=".0") || (filter = "alpha(opacity=0)");
}
(this.container || document.body).appendChild(mySnow);
return mySnow
} finally {
mySnow = null;
}
}BTW:先写一个雪花飘飘的类,修改上面雪花对象的位置参数为舞台范围内随机,再设置好下落和摆动属性,并添加下落出舞台范围删除(removeChlid)和创生机制(this.createSnow()),然后for循环并setTimeout间隔一定时间new出一定数量的实例,随机初始化雪花图片大小,该动画就OK了。
这个类就相当于FLASH的一个剪辑,new出一定数量位置随机的实例就相当于在FALSH界面上把雪花剪辑随机位置拖放到舞台背景中。
我现在有一个问题,就是appendChild到舞台的元素,在FF下可见,IE6显示不了,帮我看看原因吧
for(var i=0;i<80;i++){
//创建id为snow的div对象,并返回控制句柄mysnow
var mysnow=document.createElement("div");
mysnow.setAttribute("id","snowID"+i);
mysnow.setAttribute("class","snow");
//创建雪花图片对象
var mypic=document.createElement('img');
var typeNum=Math.random()*3;
typeNum = Math.floor(typeNum);
switch(typeNum){
case 0:
mypic.setAttribute("src","images/snow1.GIF");
break
case 1:
mypic.setAttribute("src","images/snow2.GIF");
break
case 2:
mypic.setAttribute("src","images/snow3.GIF");
break
}
//div添加雪花图片节点
mysnow.appendChild(mypic);
document.documentElement.appendChild(mysnow)
//snowing(mysnow,i);
}
//雪花允许出现的范围
var w=document.body.clientWidth-35;
if(document.body.clientHeight>=document.documentElement.clientHeight){
var h=document.body.clientHeight-35;
}else{
var h=document.documentElement.clientHeight-35;
}
//雪花的运动速度
var speedY=Math.random()*4+2;
var speedX=5-speedY;
//为精简代码,将obj.style的句柄转到变量oStyle上
var oStyle=obj.style;
//设置层的X坐标值为指定范围内的随机数
oStyle.posLeft=Math.random()*w|0;
//设置层的Y坐标值为指定范围内的随机数
oStyle.posTop=Math.random()*h|0
//每100毫秒执行一次函数
setInterval(function(){
with(oStyle){//为下面的语句设定默认对象oStyle
//以speedY为步长改变层的Y坐标值
posTop+=speedY;
//以speedX为步长改变层的X坐标值
posLeft+=speedX;
//在边界(下、上、左和右)时的处
if(posTop>h)posTop=0
else if(posTop<0)posTop=h
else if(posLeft<=0)posLeft=w
else if(posLeft>=w)posLeft=0
document.getElementById("snowID"+n).style.top=posTop+"px";
document.getElementById("snowID"+n).style.left=posLeft+"px";
}
},100)
}
2、把“document.documentElement.appendChild(mysnow)”改为“document.body.appendChild(mysnow)”