您的位置:寻梦网首页编程乐园CSS 初步DHTML动态效果实例
渐渐隐去和显现的效果

上一页 返回目录 下一页

名称:

渐渐隐去和显现的效果

实例:
 

 

 

 

 

 

 

 

演示区域

教程: 将下面的代码加入<body>和</body>之间:

<div style="position:absolute;left:200;top:85;width:400;height:200;background-
color:yellow;
color:blue;font-size:20px;border:solid black;" id="main"><div id="Inner1" style="position:relative;left:20%;top:35%;width:60%;height:30%; filter:blendTrans(duration=3);"><p align="center">
演示区域</p>
</div><div id="control" style="position:absolute;left:180;top:160">
<dd><input type="button" value="
开始" onclick="toggleMultimedia();"> </dd>
</div></div>

将下面的代码加到html文件的最后

<script language="JavaScript">
var curObj=Inner1,i=0;
words=new Array(3);
words[0]="<p align=center>
渐渐隐去</p>";
words[1]="<p align=center>
慢慢浮现</p>";
words[2]="<p align=center>
这就是Blend的效果</p>";

function toggleMultimedia() {
curObj.innerHTML=words[i];
if (curObj.filters(0).status == 2) {
curObj.filters(0).Stop();
if (curObj.style.visibility == "hidden")
curObj.style.visibility = "visible";
else
curObj.style.visibility = "hidden";
window.setTimeout("toggleMultimedia()", 1);
}
//
准备开始
curObj.filters(0).Apply();

if (curObj.style.visibility == "hidden")
{curObj.style.visibility = "visible";}
else
{curObj.style.visibility = "hidden";
if (i==2) i=-1;
i=i+1;}

//
开始
curObj.filters(0).Play();
window.setTimeout("toggleMultimedia()",4000);
}
</script>

 

说明:  
上一页 返回目录 下一页