心情论坛 » 『计算机技术』 » 用JavaScript制作活动字幕


2009-4-27 20:05 微风
用JavaScript制作活动字幕

活动字幕是网页中经常使用的组件之一,它能使整个网页更有动感,显得很有生气。现在的网站中也越来越多地使用活动字幕来加强网页的互动性。用JavaScript编程可以实现各种活动字幕效果,所需的代码很少,确实能够以较少的下载时间换来较好的效果。该标记语法格式如下:o Y0wK+`^a..

M Z|5}av%D..   〈marquee
Ec'qQOdJ9b-M.. D)lz\P#TA M..

{Ld~$o#c..   aligh=left/center/right/top/bottomc1JZI r[(K'lc..
3hA!t B,q/y{..
  bgcolor=#n xK#k1^[6l5G\&i..
x3t"_(c+V"yT$q..
  font=n
(\#[0Ix|x't..
7Q };H5O R!}..   direction=left/right/up/down %?6l%wn"baq$W..

;yr(pg&wL+X..   behavior=type )F|4c9y-cj"dm2j..
4}U&`DL~p8K..
  height=n /YB1Dv:a-G#p..

_ yQ%c'J!Ii'c2m..   hspace=n kU%p$G1qyw"I5F.h L..

Y YynJ^#HE8q p..   scrollamount=n `'aQlOBB.V!Fp..

MB0N#s N#B0P..   Scrolldelay=n
i1r@rg O!\(p..
,K7\SPGP8V9q..   width=n
2Ui7{"nO!FSK.. _R Bp,R..
  VSpace=n S| b%dupV#T..
| h0i4@"b'L..
  loop=n〉
F2pW3j:f x/^ Z.q.. #ij @8qU `[..
  可以看出由于活动字幕的显示方式多种多样,可选的参数也很多。&x7C9|4rumu)h'E2HFA..
Fi Z!g0]2N1H..
  Bgcolor:用于设定活动字幕的背景颜色,一般是十六进制数。rX/hr]5w'~e..
]%d$Hi8t f!MS Br..
  Behavior:用于设定滚动的方式,主要由三种方式:behavior="scroll"表示从一端滚动到另一端;behavior="slide"表示从一端快速滑动到另一端,且不重复;behavior="alternate"表示在两端之间来回滚动。^h4u|*z'p..
vq6EWu)bO4U1{'|!J..
  Hspace和vspace:分别用于设定滚动字幕的左右边框和上下边框的宽度。*}3C+{8W"B0o z..
'_nZ Z(Rg&hoL..
  Scrollamount:用于设定活动字幕一次滚动的距离。8RH R8d+u5{a3eZ..
%c^O(M!R X1W..
  scrolldelay:用于设定滚动两次之间的延迟时间。0K6YnfZ QC..
|T U6G9A8V'l^ s8VEI..
  Loop:用于设定滚动的次数,当loop=-1表示一直滚动下去,直到页面更新。l5g*y{yT[#z+l..
.z-}bMi6J|..
  〈marquee〉标记的默认情况是向左滚动无限次,字幕高度是文本高度,滚动范围:水平滚动的宽度是当前位置的宽度;垂直滚动的高度是当前位置的高度。下面是两个通过JavaScript编程实现特殊效果活动字幕的脚本代码:
-fUQ/a(X.. `jsf.A Mb|];N4c..
  ★带链接的水平滚动字幕★
7f)^R4rz3W6_w&TS..
q_ F$sMA-ou l2Q..   带链接的水平滚动字幕一般用于广告宣传,非常醒目:
D7gA1`K..
0m8w6BA;_S5ylW&[1i..   〈script language="JavaScript"〉
)x C2g%y.xw.. $i!GLY"nD4}(c*i-W..
  var marqueewidth=400
0F.DQ#GYW$j"r.. -eqKJ4f2Zm..
  var marqueeheight=20
:Ka]q7?n.. 7q$q'?-L(|'t..
  var speed=4
Fi'r)s&}H.. |4~6kh];rF..
  var marqueecontents='〈strong〉〈big〉欢迎访问〈a href="www.cce.com.cn"〉中国电脑教育报网站〈/a〉欢迎您光临〈a href="mailto:net@cce.com.cn"〉给我来封信!〈/a〉〈/big〉〈/strong〉〈/font〉'5E\'^.b-q..

)r|3{y^ z `..   document.write('〈marquee scrollAmount='+speed+' style="width:'+marqueewidth+'"*Yp+NX iV..
&e;fw:Gy;R$ly G..
  〉'+marqueecontents+'〈/marquee〉')
2G%xPK ](]#eo:L.. \R.}*W(NI,q$i.lRb,P6H..
  〈/script〉
A4c^,aVF}..
NoW2y Rc z5S..   ★带链接的垂直滚动字幕★
daQoic*E..
'h8f8nU@2So:Lhn1K p..   垂直滚动的活动字幕常用于以滚动方式发布新闻。脚本代码中参数“behavior、derection、width、height、scrollamount、scrolldelay”分别确定了活动字幕的滚动方式、滚动方向、宽度、高度、一次滚动距离、延迟时间等,另外参数“onmouseover='this.stop()'”所实现的效果是当鼠标指针移动到活动字幕上时,字幕停止滚动,参数“onmouseout='this.start()'”恰好与之相反。
~6DpC}*V#U..
H"^&U[Q4rl..   〈script language=vbScript〉document.write("〈marquee behavior=scroll direction=up width=130 height=80 scrollamount=1 scrolldelay=60 onmouseover='this.stop()' onmouseout='this.start()'〉")〈/script〉5[cO7E{k..
!_i}T2S!X2Jf..
  〈p〉〈a href="www.sohu.com"〉TrS5Y9V'l)Ot&Q..
} X8EL[eh[)T..
  〈/a〉〈br〉
,W)QZXF)et0U"Ie;w.. i%pnh/~%L..
  〈a href="xwgg/bys.htm "〉~=~〉〉毕业班学生下周离校〈/a〉〈br〉R%zw'p?kQ..
Fqaf5P:q&E q..
  〈a href="xwgg/fj.htm "〉~=~〉〉7月10日放暑假〈/a〉〈br〉%Hl&Y A4T4Cj \7N..
E/?4T1zE1{5Tb..
  〈a href="xwgg/slnh"〉~=~〉〉省水利年会在我校召开〈/a〉〈br〉〈br〉
Q2X!k k+a,E1_y+W.. 2?%n"Z4P@..
  〈script language=vbScript〉document.write
B8yg t%N"b`Dl]2s;m.. 'U LO]CB..
  ("〈/marquee〉")〈/script〉
h3^-C%Otf`;O)sW.. 9Zjw_ Lw;av#JT2hY..
  〈/p〉

页: [1]


Powered by © 2002-2018 www.eXinQing.net