一、圖片向左移動
從右向左移動
代碼
<MARQUEE scrollAmount=2><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"><BR>從右向左移動</MARQUEE>
二、圖片向右移動
從左向右移動
代碼
<MARQUEE scrollAmount=2 direction=right><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"><BR>從左向右移動</MARQUEE>
三、圖片向上移動
代碼
<CENTER>
<MARQUEE style="WIDTH: 300px; HEIGHT: 180px" scrollAmount=2 direction=up>
<P align=center><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"></P></MARQUEE></CENTER>
四、圖片向下移動
代碼
<CENTER>
<MARQUEE style="WIDTH: 300px; HEIGHT: 180px" scrollAmount=2 direction=down>
<P align=center><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"></P></MARQUEE></CENTER>
五、圖片左右來回移動
代碼
<P align=center>
<MARQUEE style="WIDTH: 500px; HEIGHT: 120px" scrollAmount=4 behavior=alternate><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"></MARQUEE></P>
六、圖片上下來回移動
代碼
<P align=center>
<MARQUEE style="WIDTH: 150px; HEIGHT: 210px" scrollAmount=4 direction=up behavior=alternate><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"></MARQUEE></P>
七、圖片波浪式移動
代碼
<MARQUEE style="WIDTH: 700px; HEIGHT: 150px" scrollAmount=2 direction=up behavior=alternate>
<MARQUEE direction=right><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"></MARQUEE></MARQUEE>
八、圖片波浪式來回移動
代碼
<MARQUEE style="WIDTH: 700px; HEIGHT: 180px" scrollAmount=2 direction=down behavior=alternate>
<MARQUEE scrollAmount=2 direction=right behavior=alternate><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"></MARQUEE></MARQUEE>
九、圖片由中間向兩邊移動
代碼
<P align=center>
<MARQUEE style="WIDTH: 300px; HEIGHT: 150px" scrollAmount=2><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"></MARQUEE>
<MARQUEE style="WIDTH: 300px; HEIGHT: 150px" scrollAmount=2 direction=right><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"></MARQUEE></P>
十、圖片上下向中間移動
代碼
<CENTER>
<MARQUEE style="WIDTH: 300px; HEIGHT: 180px" scrollAmount=2 direction=down>
<P align=center><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"></P></MARQUEE></CENTER>
<CENTER>
<MARQUEE style="WIDTH: 300px; HEIGHT: 180px" scrollAmount=2 direction=up>
<P align=center><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"></P></MARQUEE></CENTER>
十一、圖片躲躲,跑給你追移動
代碼
<MARQUEE behavior=alternate>
<MARQUEE scrollAmount=5 width=150><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"></MARQUEE></MARQUEE>
十二、圖片躲躲,跑給你追移動
代碼
<P align=center>
<MARQUEE style="WIDTH: 600px; HEIGHT: 150px" scrollAmount=5>
<MARQUEE style="WIDTH: 200px; HEIGHT: 150px" scrollAmount=5 direction=right><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"></MARQUEE></MARQUEE></P>
十三、圖片躲躲,跑給你追移動
代碼
<P align=center>
<MARQUEE scrollAmount=3 direction=down width=180 height=200>
<MARQUEE scrollAmount=3 direction=up height=180><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"></MARQUEE></MARQUEE></P>
十四、圖片躲躲,跑給你追移動
代碼
<P align=center>
<MARQUEE scrollAmount=3 direction=up behavior=alternate width=180 height=200>
<MARQUEE scrollAmount=3 direction=up height=150><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"></MARQUEE></MARQUEE></P>
十五、圖片往上飄移
代碼
<P align=center>
<MARQUEE scrollAmount=3 behavior=alternate width=600 height=300>
<MARQUEE scrollAmount=3 direction=up width=150 height=300><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"></MARQUEE></MARQUEE></P>
十六、圖片走走停停
代碼
<P align=center>
<MARQUEE scrollAmount=3 behavior=alternate width=600>
<MARQUEE scrollAmount=3 behavior=alternate width=200><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"></MARQUEE></MARQUEE></P>
十七、多圖片向上移動
代碼
<CENTER>
<MARQUEE style="WIDTH: 300px; HEIGHT: 250px" scrollAmount=2 direction=up>
<P align=center><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"> <BR><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"> <BR><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"> </P></MARQUEE></CENTER>
十八、圖片對開移動
代碼
<TABLE width=400 align=center>
<TBODY>
<TR>
<TD align=middle width=100>
<MARQUEE scrollAmount=1 direction=right><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"></MARQUEE></TD>
<TD align=middle width=100>
<MARQUEE scrollAmount=1><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"></MARQUEE></TD>
<TD align=middle width=100>
<MARQUEE scrollAmount=1 direction=right><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"></MARQUEE></TD>
<TD align=middle width=100>
<MARQUEE scrollAmount=1><IMG src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"></MARQUEE></TD></TR></TBODY></TABLE>
十九、圖片展開和收起
代碼
<MARQUEE scrollAmount=3 direction=down height=128>
<MARQUEE scrollAmount=3 direction=up height=128><IMG style="DISPLAY: block; TEXT-ALIGN: center" src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"></MARQUEE></MARQUEE>
注:移動高度=圖片高度
二十、圖片展開和收起
<P align=center>
<MARQUEE scrollAmount=3 width=128 height=128>
<MARQUEE scrollAmount=3 direction=right width=128 height=128><IMG style="DISPLAY: block; TEXT-ALIGN: center" src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_1.gif"></MARQUEE></MARQUEE></P>
注:移動寬度=圖片寬度
二十一、圖片移動特效+Flash
代碼
<P>
<TABLE height=530 cellPadding=0 width=396 align=center background=http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_3.jpg border=0>
<TBODY>
<TR>
<TD>
<DIV align=center>
<MARQUEE scrollAmount=4 width=396 height=530>
<MARQUEE scrollAmount=4 direction=right width=396 height=530><IMG style="FILTER: alpha WIDTH: 396px; HEIGHT: 530px" height=530 src="http://image7.360doc.com/DownloadImg/2010/02/0419/2284301_2.jpg" width=396></MARQUEE></MARQUEE>
<P style="MARGIN-TOP: -540px; MARGIN-LEFT: 10px"></P><EMBED style="DISPLAY: block" pluginspage=http://www.macromedia.com/go/getflashplayer src=http://pp6143.com.ne.kr/s52.swf width=350 height=500 type=application/x-shockwave-flash quality="high" wmode="transparent" allowNetworking="internal" allowScriptAccess="never"></DIV></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></P>
各參數(shù)詳解:
1)scrollAmount。它表示速度,值越大速度越快。如果沒有它,默認(rèn)為6,建議設(shè)為1~3比較好。
2)width和height,表示滾動區(qū)域的大小,width是寬度,height是高度。特別是在做垂直滾動的時候,一定要設(shè)height的值。
3)direction。表示滾動的方向,默認(rèn)為從右向左:←←←。可選的值有right、down、up。滾動方向分別為:right表示→→→,up表示↑,down表示↓。
4)scrollDelay,這也是用來控制速度的,默認(rèn)為90,值越大,速度越慢。通常scrollDelay是不需要設(shè)置的。
5)behavior。用它來控制屬性,默認(rèn)為循環(huán)滾動,可選的值有alternate(交替滾動)、slide(幻燈片效果,指的是滾動一次,然后停止?jié)L動)