通俗基础教程
电脑操作教程
电脑怎样拨号上网
如何做个人网页
怎样做局域网
Word教程(文字处理)
图形图象处理入门
经典提高教程
怎样使用代理服务器
如何做无盘工作站
Photoshop教程
Dreamweaver教程
Flash教程
Firework教程
Frontpage2000教程
Authware教程
Office2000教程
如何制作动画图片
OICQ&ICQ使用方法

高手学习指南

硬件升级技巧
CGI教程
ASP教程

PHP教程

注册表使用技巧
路由器的设置
网站建设指南
SQL
合作网站
栏目制作月光软件
最近更新:
类别:网站制作

问题一:我想请教一个问题,希望能得到您的帮助。很多网站的主页面上都有在页面上来回移动的图片,而且时隐时现,是怎么做出来的?

木鸟答:请把下边的代码copy进你的网页,注意需要改变的部分我已经注明了。 你所说的图片时隐时现应该是用的gif动画。

<script language="JavaScript">

var brOK=false;

var mie=false;

var aver=parseInt(navigator.appVersion.substring(0,1));

var aname=navigator.appName;

function checkbrOK()

{if(aname.indexOf("Internet Explorer")!=-1)

{if(aver>=4) brOK=navigator.javaEnabled();

mie=true;

}

if(aname.indexOf("Netscape")!=-1)

{if(aver>=4) brOK=navigator.javaEnabled();}

}

var vmin=2;

var vmax=5;

var vr=0.02;

var timer1;

function Chip(chipname,width,height)

{this.named=chipname;

this.vx=vmin+vmax*Math.random();

this.vy=vmin+vmax*Math.random();

this.w=width;

this.h=height;

this.xx=0;

this.yy=0;

this.timer1=null;

}

function movechip(chipname)

{

if(brOK)

{eval("chip="+chipname);

if(!mie)

{pageX=window.pageXOffset;

pageW=window.innerWidth;

pageY=window.pageYOffset;

pageH=window.innerHeight;

}

else

{pageX=window.document.body.scrollLeft;

pageW=window.document.body.offsetWidth-22;

pageY=window.document.body.scrollTop;

pageH=window.document.body.offsetHeight-34;

}


chip.xx=chip.xx+chip.vx;

chip.yy=chip.yy+chip.vy;


chip.vx+=vr*(Math.random()-0.5);

chip.vy+=vr*(Math.random()-0.5);

if(chip.vx>(vmax+vmin)) chip.vx=(vmax+vmin)*2-chip.vx;

if(chip.vx<(-vmax-vmin)) chip.vx=(-vmax-vmin)*2-chip.vx;

if(chip.vy>(vmax+vmin)) chip.vy=(vmax+vmin)*2-chip.vy;

if(chip.vy<(-vmax-vmin)) chip.vy=(-vmax-vmin)*2-chip.vy;

if(chip.xx<=pageX)

{chip.xx=pageX;

chip.vx=vmin+vmax*Math.random();

}

if(chip.xx>=pageX+pageW-chip.w)

{chip.xx=pageX+pageW-chip.w;

chip.vx=-vmin-vmax*Math.random();

}

if(chip.yy<=pageY)

{chip.yy=pageY;

chip.vy=vmin+vmax*Math.random();

}

if(chip.yy>=pageY+pageH-chip.h)

{chip.yy=pageY+pageH-chip.h;

chip.vy=-vmin-vmax*Math.random();

}


if(!mie)

{eval('document.'+chip.named+'.top ='+chip.yy);

eval('document.'+chip.named+'.left='+chip.xx);

}

else

{eval('document.all.'+chip.named+'.style.pixelLeft='+chip.xx);

eval('document.all.'+chip.named+'.style.pixelTop ='+chip.yy);

}

chip.timer1=setTimeout("movechip('"+chip.named+"')",140);

}

}


function hide(chipname){

if(brOK){

eval("chip="+chipname);

if(!mie)

eval('document.'+chip.named+'.visibility ='+"'hide'");

else

eval('document.all.'+chip.named+'.style.visibility ='+"'hidden'");

}

}


function stopme(chipname)

{if(brOK)

{//alert(chipname)

eval("chip="+chipname);

if(chip.timer1!=null)

{clearTimeout(chip.timer1)}

}

}

var chip1;

function pagestart()

{checkbrOK();

chip1=new Chip("chip1",117,75);

if(brOK)

{ movechip("chip1");

}

}

//if(brOK) {stopme('chip1');}

</script>

<div id=chip1

style="height: 105; position: absolute; visibility: visible; width: 140; left: 180; top: 157">

<table border=0 cellpadding=4 cellspacing=0 class=bd width=60>

<tbody>

<tr>

<td align=middle class=bg2><a class=prs1

href="点击图片的链接地址" target=_blank><img border=0 class=bd src="图片文件的url" width="图片宽度" height="图片高度"></a></td>

</tr>

</tbody>

</table>

</div>

<script event=onload for=window language=JavaScript>

pagestart();

</script>

木鸟主页: http://book2u.myrice.com

freshly答:这个来回移动的图——〉叫做动态HTML动画!用DW3/DW4中的Timelines,就是时间线! windows(窗口)\timelines(时间线)打开!

新建一个层,然后在层里面放一图片(也可是动画、文字),新建一个时间线,然后命名!这是移动时间线可以应用到图像了。用这种方法,如果动画要拐弯比较麻烦点。所以还有另一种方法,选择modify——〉timeline——〉add object to timeline ,这个命令的意思是将对象添加到时间线。直接拖动层,就可以创建动画了,也就是你拖动时的路径,等于网页打开始后的播放路线!! 记得,时间线创建完成之后,不要忘了选中autoplay(自动播放)。

freshly档案:freshly@263.net http://freshly.yeah.net oicq:10316225

   
相关教程
Window.open() 全攻略
HTML文件HEAD内部标记浅析
让网页更容易阅读的方法
状态栏上的动态HTML技术
带链接的滚动文字条
鼠标感应自动放大缩小的图片链接
测试访客的浏览器和操作系统
下拉选择按钮菜单
网页百戒之网页外观
网页百戒之一般注意
网页百戒之标记运用
网页百戒之进阶技巧
网页百戒之网页道德
网页百戒之内容指南
如何利用不同分辨率查看网页?
如何清除网页中不必要的HTML代码?
如何在DW的编辑状态下预览插入的FLASH作品?
怎么样才能控制弹出新窗口的位置?
怎么样才能控制弹出新窗口的位置?
怎样控制弹出窗口大小?
网页中制作边角圆润的图形
网页中飘动的图片的制作