为您的个人主页设计开幕动画_主页制作_网上学园_科技时代

首页 ● 新闻 ● 搜索 ● 短信 ● 分类 ● 聊天 ● 企业


上移动梦网赢手机大奖	<A HREF="http://ad.cn.doubleclick.net/jump/tech.sina.com.cn/;abr=!ie;sz=468x60;ord=85756695991387980?" target="_new"><IMG SRC="http://ad.cn.doubleclick.net/ad/tech.sina.com.cn/;abr=!ie;sz=468x60;ord=85756695991387980?" border=0 height="60" width="468"></A>

新浪首页 > 科技时代 > 网上学园 > 主页制作 > 正文

为您的个人主页设计开幕动画

http://www.sina.com.cn 2002/04/15 11:55 赛迪网

　　文/洪宝光

　　每当看到一个好的动画时，我都会想着为自己主页设置一个开幕画面。效果是有一段动画以后再进入主页，这样感觉是不是很爽啊！设计很简单，大家可要好好地看呀！

　　一、在<body>和</body>添加如下代码：

　　<style>
.intro{position:absolute;
left:0;
top:0;
layer-background-color:#e

8eee8;
background-color:#e8eee8;
border:0.1px solid #e8eee8
}
</style>

　　二、设置一个图层，名字是i1。然后编辑代码，代码添加如图1所示：

　　<div id="i1" class="intro"></div><div id="i2" class="intro"></div><div id="i3"
class="intro"></div><div id="i4" class="intro"></div><div id="i5" class="intro"></div><div
id="i6" class="intro"></div><div id="i7" class="intro"></div><div id="i8" class="intro"></div>
<SCRIPT language=javascript>
var speed=30
var temp=new Array()
var temp2=new Array()
if (document.layers){
for (i=1;i<=8;i++){
temp[i]=eval("document.i"+i+".clip")
temp2[i]=eval("document.i"+i)
temp[i].width=window.innerWidth/8-0.3
temp[i].height=window.innerHeight
temp2[i].left=(i-1)*temp[i].width
}
}
else if (document.all){
var clipbottom=document.body.offsetHeight，cliptop=0
for (i=1;i<=8;i++){
temp[i]=eval("document.all.i"+i+".style")
temp[i].width=document.body.clientWidth/8
temp[i].height=document.body.offsetHeight
temp[i].left=(i-1)*parseInt(temp[i].width)
}
}
function openit(){
window.scrollTo(0，0)
if (document.layers){
for (i=1;i<=8;i=i+2)
temp[i].bottom-=speed
for (i=2;i<=8;i=i+2)
temp[i].top+=speed
if (temp[2].top>window.innerHeight)
clearInterval(stopit)
}
else if (document.all){
clipbottom-=speed
for (i=1;i<=8;i=i+2){
temp[i].clip="rect(0 auto+"+clipbottom+" 0)"
}
cliptop+=speed
for (i=2;i<=8;i=i+2){
temp[i].clip="rect("+cliptop+" auto auto)"
}
if (clipbottom<=0)
clearInterval(stopit)
}
}
function gogo(){
stopit=setInterval("openit()"，100)
}
gogo()
</SCRIPT>

图1

【发表评论】【初学者园地】【科技聊天】【关闭窗口】

新闻查询