叶子谷- 网页教程

RSS订阅 站长资讯通告:
搜索: 您现在的位置: 叶子谷 >> 网页特效 >> 页面特效 >> 正文

飘动的花朵

2008-06-10 13:50:46 来源:网络 作者:佚名 【 点击:
BODY换成以下代码:


Copy code
<body onload=doplay()>


将下面的代码加在head之间

<style>
#Layer0 {
Z-INDEX: 10; LEFT: -100px; WIDTH: 60px; POSITION: absolute; TOP: -100px; HEIGHT: 60px
}
#Layer1 {
Z-INDEX: 20; LEFT: -100px; WIDTH: 60px; POSITION: absolute; TOP: -100px; HEIGHT: 60px
}
#Layer2 {
Z-INDEX: 30; LEFT: -100px; WIDTH: 60px; POSITION: absolute; TOP: -100px; HEIGHT: 60px
}
#Layer3 {
Z-INDEX: 40; LEFT: -100px; WIDTH: 60px; POSITION: absolute; TOP: -100px; HEIGHT: 60px
}
#Layer4 {
Z-INDEX: 50; LEFT: -100px; WIDTH: 60px; POSITION: absolute; TOP: -100px; HEIGHT: 60px
}
#Layer5 {
Z-INDEX: 60; LEFT: -100px; WIDTH: 60px; POSITION: absolute; TOP: -100px; HEIGHT: 60px
}
#Layer6 {
Z-INDEX: 70; LEFT: -100px; WIDTH: 60px; POSITION: absolute; TOP: -100px; HEIGHT: 60px
}
BODY {
FONT-SIZE: 9pt; WORD-SPACING: normal; LINE-HEIGHT: 13pt
}
P {
FONT-SIZE: 9pt; WORD-SPACING: normal; LINE-HEIGHT: 13pt
}
TD {
FONT-SIZE: 9pt; WORD-SPACING: normal; LINE-HEIGHT: 13pt
}
</style>
<SCRIPT language=JavaScript>
xfirst = new Array(80,150,220,310,400,590,680); //初始x位置
yfirst = new Array(0,180,70,10,50,30,140);  //初始y位置
xcoor = new Array(80,150,220,310,400,590,680); 
ycoor = new Array(0,180,70,10,50,30,140);
xdirec= new Array(1,-1,1,-1,1,-1); //初始方向 -1 为左 and 1 为右
var ns = navigator.appName == "Netscape";
function doplay()
{
    var x,y,I,j,w,h;
w = window.screen.width - 100;
// w = document.body.clientWidth - 100;
h = window.screen.height - 100;
// h = document.body.clientHeight - 50;
    for(j=0;j<7;j++){
    I=Math.random();      //随机改变运动方向
    if (I > 0.95) xdirec[j] = 0 - xdirec[j]; 
    x=Math.floor(10*Math.random());
    y=Math.floor(5*Math.random()); //x和y方向上的随机增量
    if ( xdirec[j] == 1 ) xcoor[j] = xcoor[j] + x;
    else xcoor[j] = xcoor[j] - x;
    ycoor[j] = ycoor[j] + y;    //x越界则变向,y越界则返回
    if ( xcoor[j] >= w ) {xcoor[j]=w;xdirec[j]=-1;}
    if ( xcoor[j] <= 0 ) {xcoor[j]=0;xdirec[j]=1;}
    if ( ycoor[j] >= h ) {xcoor[j]=xfirst[j];ycoor[j]=yfirst[j];}
        if (!ns){ eval('document.all'+'["Layer'+j+'"]'+'.style.left='+xcoor[j]);
  eval('document.all'+'["Layer'+j+'"]'+'.style.top='+ycoor[j]);}
        else {  eval('document.layers'+'["Layer'+j+'"]'+'.left='+xcoor[j]);
  eval('document.layers'+'["Layer'+j+'"]'+'.top='+ycoor[j]);}
}
    setTimeout('doplay()',100); 
}
</SCRIPT>


将下面的代码加在body之间

<div id=Layer0> <img height=14 src="hua1.gif" width=14> </div>
<div id=Layer1> <img height=25 src="hua.gif" width=25> </div>
<div id=Layer2> <img height=25 src="hua.gif" width=25> </div>
<div id=Layer3> <img height=14 src="hua2.gif" width=14> </div>
<div id=Layer4> <img height=14 src="hua1.gif" width=14> </div>
<div id=Layer5> <img height=14 src="hua2.gif" width=14> </div>
<div id=Layer6> <img height=25 src="hua.gif" width=25> </div>

Tags: 网页特效  
责任编辑:cptedu
  • 发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口】   
  • 上一篇文章:
  • 下一篇文章:
  • 姓 名: * Oicq:
    评 分: 1分 2分 3分 4分 5分
    评论内容:
    广告也精采
    热门文章
    设为首页 -加入收藏 - 联系我们 - 友情链接 - 版权声明 - 管理登陆