html文字代码怎么写( 二 )


当然,这是最简单的一种,你可能看到的有些网页上的效果在移动的过程比这要复杂一些,但都是在这个基础上增加一些移动的变化过程而已 。4、当然要使真正的效果出现,还得在<body>;标记中加上触发事件调用程序,使程序动作起来 。
在<body>;标记中加上代码:onload="move()" onm ousemove="canmove()",前一个函数的作用是在网页加载时就调用“move()”程序,使其开始刷新图层的位置坐标;后一个事件的作用是,一旦在页面上移动鼠标,就重新计算它的位置坐标 。二、稍复杂一点的效果 在上例的基础上稍作一些改动,可获得更好的效果,如使“欢迎光临!”这几个字不仅是分开移动,在移到新位置后,还不停地左右移动,似乎在列队欢迎 。
要实现移动过程的变化,就要把每个文字分开,一个图层放一个字(或一张图片),然后分开移动到新的位置 。所以为了方便,用数组来存放图层的位置坐标 。
另外,由于图层较多,插入图层比较麻烦,也会使代码大增加,因此采用了动态编写图层代码的办法 。制作方法如下: 1、在<head>;与</head>;之间插入下面这段程序:<SCRIPT language="javascript"><!--var x,yvar step=20var can=0var information="欢迎光临!"; //在这里写入跟随鼠标移动的文字information=information.split(""); //把字符串拆分成单个的文字Il=information.length; //获取字符的个数,存放在Il变量中k=0;var xpos=new Array() //声明一个数组,存放各图层的X位置坐标for (i=0;i<=Il-1;i++){ //给数组赋初值xpos[i]=-50}var ypos=new Array() //声明一个数组,存放各图层的Y位置坐标for (i=0;i<=Il-1;i++){ //给数组赋初值ypos[i]=-50}function canmove() {x=document.body.scrollLeft+event.clientX;y=document.body.scrollTop+event.clientY;can=1; k=0;step=20}function move() {if (can) {k++;if (k<20) {step++;}elseif (k<40) {step--;}else {k=0;} //计算图层左右移动的偏移量for (i=Il-1;i>=1;i--){ //计算各图层在新位置的X、Y坐标xpos[i]=xpos[i-1]+step;ypos[i]=ypos[i-1]}xpos[0]=x+step;ypos[0]=yfor (i=0;i<Il-1;i++){ //改变各图层位置的X、Y坐标,使其移到新的位置var thisdiv=eval("div"+(i)+".style");thisdiv.posLeft=xpos[i];thisdiv.posTop=ypos[i]}}setTimeout("move()",30)} //每30秒刷新一次--></SCRIPT> 2、在<body>;标记的后面加上这段程序:<script language="Javascript"><!--for (i=0;i<=Il-1;i++){document.write("<div id='div"+i+"' style='position:absolute;top:-50px; font-size: 9pt;font-weight: 800; color: #0000FF'>"+information[i]+"</div>");}--></script>; 这段程序的作用是动态自动编写存放移动文字图层的HTML代码,并把相应 。
5. 谁能帮我编写个文字移动html代码 <style type="text/css">
a{font-size:12px;color:#F00;margin:30px;}
a:link, a:visited{text-decoration:none;}
a:hover {text-decoration:underline;}
</style>
<body>
<table width="800px" height="30" border="1" cellpadding="0" cellspacing="0" bordercolor="#666666">
<tr>
<td><Marquee direction=left onm ouseover=this.stop() onm ouseout=this.start() scrollamount=3 scrollDelay=4 width=800 Height=20>
<img src="http://www.xuexi88.com/zhishi/arrow_right.gif" ><a href="http://www.xuexi88.com/zhishi/#" title="呵呵呵呵" target="_blank" style="font-size:12px;color:#F00;">;呵呵呵呵</a>
<img src="http://www.xuexi88.com/zhishi/arrow_right.gif" ><a href="http://www.xuexi88.com/zhishi/#" title="呵呵呵呵呵呵" target="_blank" style="font-size:12px;color:#F00;">;呵呵呵呵</a>
<img src="http://www.xuexi88.com/zhishi/arrow_right.gif" ><a href="http://www.xuexi88.com/zhishi/#" title="呵呵呵呵呵呵呵呵" target="_blank" style="font-size:12px;color:#F00;">;呵呵呵呵</a>