电竞比分网-中国电竞赛事及体育赛事平台

搜索
分享

動態(tài)圖片處理特效代碼

 紅塵精靈 2011-04-19

一、自右左移動

  代碼格式

<DIV align=center>
<MARQUEE scrollAmount=3 direction=left width=顯示窗口寬度 height=顯示窗口高度>
<IMG src="圖片連接地址" width=圖片寬度 height=圖片高度>
</MARQUEE><DIV>

     

動態(tài)圖片處理特效代碼 - 風語者 - Upflyhigh 的博客
動態(tài)圖片處理特效代碼 - 風語者 - Upflyhigh 的博客

代碼說明：

(1)窗口和圖片的寬度、高度的單位為像素。

(2)顯示窗口寬度通常以大于等于圖片寬度為宜(特長圖片例外)，顯示窗口高度通常應等于圖片高度。

(3)scrollAmount為移動速度。

 

(二)多張圖片左移

  代碼格式

<DIV align=center>
<MARQUEE scrollAmount=2 direction=left width=顯示窗口寬度 height=顯示窗口高度>
<IMG src="圖片1連接地址" width=圖片寬度 height=圖片高度>
<IMG src="圖片2連接地址" width=圖片寬度 height=圖片高度>
<IMG src="圖片3連接地址" width=圖片寬度 height=圖片高度>
<IMG src="圖片4連接地址" width=圖片寬度 height=圖片高度>
<IMG src="圖片5連接地址" width=圖片寬度 height=圖片高度>
<IMG src="圖片6連接地址" width=圖片寬度 height=圖片高度>
……
<IMG src="圖片N連接地址" width=圖片寬度 height=圖片高度>
</MARQUEE><DIV>
 

代碼說明：(1)窗口和圖片的寬度、高度的單位為像素。

(2)顯示窗口寬度通常以大于等于圖片寬度為宜，顯示窗口高度通常應等于圖片高度。

(3)多張圖片之規(guī)格尺寸通常應大小一致。

(4)scrollAmount為移動速度。

二、自下上移動

(一)單張圖片上移

      代碼格式 

<DIV align=center>
<MARQUEE scrollAmount=3 direction=up width=顯示窗口寬度 height=顯示窗口高度>
<IMG src="圖片連接地址" width=圖片寬度 height=圖片高度>
</MARQUEE><DIV>
   

動態(tài)圖片處理特效代碼 - 風語者 - Upflyhigh 的博客
動態(tài)圖片處理特效代碼 - 風語者 - Upflyhigh 的博客

代碼說明：

(1)窗口和圖片的寬度、高度的單位為像素。

(2)顯示窗口寬度通常應等于圖片寬度，顯示窗口高度通常以大于等于圖片高度為宜(特長圖片例外)。

(3)scrollAmount為移動速度。

 

(二)多張圖片上移

  代碼格式

<DIV align=center>
<MARQUEE scrollAmount=3 direction=up width=顯示窗口寬度 height=顯示窗口高度>
<IMG src="圖片1連接地址" width=圖片寬度 height=圖片高度>
<IMG src="圖片2連接地址" width=圖片寬度 height=圖片高度>
<IMG src="圖片3連接地址" width=圖片寬度 height=圖片高度>
<IMG src="圖片4連接地址" width=圖片寬度 height=圖片高度>
<IMG src="圖片5連接地址" width=圖片寬度 height=圖片高度>
<IMG src="圖片6連接地址" width=圖片寬度 height=圖片高度>
……
<IMG src="圖片N連接地址" width=圖片寬度 height=圖片高度>
</MARQUEE><DIV>
 

代碼說明：

(1)窗口和圖片的寬度、高度的單位為像素。

(2)顯示窗口寬度通常應等于圖片寬度，顯示窗口高度通常以大于等于圖片高度為宜。

(3)多張圖片之規(guī)格尺寸通常應大小一致。

(4)scrollAmount為移動速度。

傾斜移動

 代碼格式

<DIV align=center>
<marquee scrollamount=5 direction=D1 height=顯示窗口高度>
<DIV align=center>
<marquee scrollamount=5 direction=D2 width=顯示窗口寬度><IMG src="圖片連接地址" width=圖片寬度 height=圖片高度 border=0></marquee></DIV ></marquee></DIV>
 

代碼說明：

D1=down或up，D2=left或right

左右擺動

(一)單張圖片左右擺動

代碼格式

<DIV align=center>
<MARQUEE scrollDelay=60 behavior=alternate width=顯示窗口寬度 height=顯示窗口高度>
<IMG src="圖片連接地址" width=圖片寬度 height=圖片高度 border=0></MARQUEE></DIV>

  

代碼說明：

scrollDelay為滾動兩次之間的延遲時間，數值越大越有跳躍感，可根據情況自行設定。

(二)多張圖片左右擺動

代碼格式

<DIV align=center>
<MARQUEE scrollDelay=60 behavior=alternate width=顯示窗口寬度 height=顯示窗口高度>
<IMG src="圖片1連接地址" width=圖片寬度 height=圖片高度 border=0>
<IMG src="圖片2連接地址" width=圖片寬度 height=圖片高度 border=0>
<IMG src="圖片3連接地址" width=圖片寬度 height=圖片高度 border=0>
<IMG src="圖片4連接地址" width=圖片寬度 height=圖片高度 border=0>
……
<IMG src="圖片n連接地址" width=圖片寬度 height=圖片高度 border=0>
</MARQUEE></DIV>

代碼說明：

scrollDelay為滾動兩次之間的延遲時間，數值越大越有跳躍感，可根據情況自行設定。

上下振動

(一)單張圖片上下振動

代碼格式

<DIV align=center>
<MARQUEE scrollDelay=60 direction=up behavior=alternate width=顯示窗口寬度 height=顯示窗口高度>
<IMG src="圖片連接地址" width=圖片寬度 height=圖片高度 border=0></MARQUEE></DIV>

代碼說明：

scrollDelay為滾動兩次之間的延遲時間，數值越大越有跳躍感，可根據情況自行設定。

(二)多張圖片上下振動

代碼格式

<DIV align=center>
<MARQUEE scrollDelay=60 direction=up behavior=alternate width=顯示窗口寬度 height=顯示窗口高度>
<IMG src="圖片1連接地址" width=圖片寬度 height=圖片高度 border=0>
<IMG src="圖片2連接地址" width=圖片寬度 height=圖片高度 border=0>
<IMG src="圖片3連接地址" width=圖片寬度 height=圖片高度 border=0>
<IMG src="圖片4連接地址" width=圖片寬度 height=圖片高度 border=0>
……
<IMG src="圖片n連接地址" width=圖片寬度 height=圖片高度 border=0>
</MARQUEE></DIV>

代碼說明：

(1) scrollDelay為滾動兩次之間的延遲時間，數值越大越有跳躍感，可根據情況自行設定。

(2)多張圖片上下振動的顯示窗口高度應大于N張圖片的總高度。

反相移動(多圖)

(一)自中間向左右反相移動

代碼格式

<DIV align=center>
<MARQUEE scrollAmount=3 direction=left width=左半顯示窗口寬度 height=左半顯示窗口高度>
<IMG src="圖片1連接地址">
<IMG src="圖片2連接地址">
<IMG src="圖片3連接地址">
……
<IMG src="圖片N連接地址">
</MARQUEE>
<MARQUEE scrollAmount=3 direction=right width=右半顯示窗口寬度 height=右半顯示窗口高度>
<IMG src="圖片一連接地址">
<IMG src="圖片二連接地址">
<IMG src="圖片三連接地址">
……
<IMG src="圖片M連接地址">
</MARQUEE></DIV>

代碼說明：

(1)若要使圖片自兩邊向中間移動，只需將上述代碼中的left和right的位置互換一下即可。

(2)向左右相反方向移動圖片的數量通常應相等，即M=N。

(二)自中間向上下反相移動

代碼格式

<DIV align=center>
<MARQUEE scrollAmount=3 direction=up width=上半顯示窗口寬度 height=上半顯示窗口高度>

<DIV align=center>
<IMG src="圖片1連接地址">
<IMG src="圖片2連接地址">
<IMG src="圖片3連接地址">
……
<IMG src="圖片N連接地址">
</DIV></MARQUEE></DIV>

<DIV align=center>
<MARQUEE scrollAmount=3 direction=down width=下半顯示窗口寬度 height=下半顯示窗口高度><DIV align=center>
<IMG src="圖片一連接地址">
<IMG src="圖片二連接地址">
<IMG src="圖片三連接地址">
……
<IMG src="圖片M連接地址">
</DIV ></MARQUEE></DIV>

代碼說明：

(1)若要使圖片自上下向中間移動，只需將上述代碼中的up和down的位置互換一下即可。

(2)向上下相反方向移動圖片的數量通常應相等，即M=N。

自動切換翻頁

 代碼格式 

<DIV align=center>
<EMBED pluginspage=http://www.macromedia.com/go/getflashplayer src=http://image2.sina.com.cn/bj/zonghe/pixviewer.swf width=300 height=200 type=application/x-shockwave&13;&10;&13;&10;-flash wmode="opaque" bgcolor="#38B0DE" FlashVars="pics=圖片1地址|圖片2地址|圖片3地址|……|圖片N地址&links=文章1地址|文章2地址|文章3地址|……|文章N地址&texts=文章1標題|文章2標題|文章3標題|……|文章N標題&13;&10;&13;&10;5||||&borderwidth=300&borderheight=200&textheight=0" menu="false" quality="high">
</DIV>

 

 

 

代碼說明：

(1)width=寬度(像素)，height=高度(像素)，textheight是文字區(qū)域高度，自己可根據實際自行設置。

(2)bgcolor="#38B0DE" 雙引號中間部份是背景顏色值，可以參考顏色代碼值設置。

(3)圖片地址：就是你的圖片或者文章所配圖片的地址。

文章地址：如果圖片1是你用是文章1所配的圖片，那就把文章1的地址粘貼在這里。文章標題：就是這篇文章的標題。

(4)如果需要添加文章標題，則應添加相應的文章地址和文章標題，textheight值通常在20-40之間。

圖片在邊框中移動

1.

<DIV align=center>

<DIV style="BORDER-RIGHT: 1px solid; BORDER-TOP: 1px solid; FONT-SIZE: 12px; OVERFLOW: scroll; BORDER-LEFT: 1px solid; WIDTH: 550px; LINE-HEIGHT: 20px; BORDER-BOTTOM: 1px solid; HEIGHT: 80px">

<P>這是測試文字</P></DIV></DIV>

<DIV align=center> </DIV>

<DIV align=center>

<TABLE cellSpacing=20 cellPadding=0 width=500 background=http://www.s1./~rouge/free/17.jpg border=1>

<TBODY>

<TR>

<TD>

<TABLE cellSpacing=5 cellPadding=0 width="100%" background=http:///Background_tiles/floral1_small.jpg border=0>

<TBODY>

<TR>

<TD align=middle>

<TABLE height=333 width=500 background=http://www./BBS/UploadFile/2004-9/2004943127488.jpg border=1>

<TBODY>

<TR>

<TD>

<CENTER>

<MARQUEE scrollAmount=2 width="100%" direction="left">

<P align=center><IMG src=" src=" src=" src=" src=" src=" src=" src="

2.

<DIV align=center>
<TABLE borderColor=#cccccc height=350 cellSpacing=0 cellPadding=0 width=430 background=http://image27.360doc.com/DownloadImg/2011/04/1907/11038406_2.jpg border=1>
<TBODY>
<TR>
<TD>
<MARQUEE scrollAmount=2 scrollDelay=90 direction=up width=420 height=350>
<TABLE style="WIDTH: 400px; HEIGHT: 266px" borderColor=#cccccc cellSpacing=2 cellPadding=3 align=center background=http://image27.360doc.com/DownloadImg/2011/04/1907/11038406_3.jpg border=0>
<TBODY>
<TR>
<TD></TD></TR></TBODY></TABLE>
</MARQUEE></TD></TR></TBODY></TABLE></DIV>

3.

<DIV align=center>

<TABLE cellSpacing=0 cellPadding=0 width=400 align=center>

<TBODY>

<TR align=middle>

<TD style="BORDER-RIGHT: rgb(0,0,0) 1px dotted; BORDER-TOP: rgb(0,0,0) 1px dotted; BORDER-LEFT: rgb(0,0,0) 1px dotted; BORDER-BOTTOM: rgb(0,0,0) 1px dotted">

<DIV align=center>

<MARQUEE scrollDelay=60 behavior=alternate width="100%" height=150>

<DIV align=center><IMG height=140 src="

<TR>

<TD style="BORDER-RIGHT: rgb(0,0,0) 1px dotted; BORDER-LEFT: rgb(0,0,0) 1px dotted; BORDER-BOTTOM: rgb(0,0,0) 1px dotted">

<DIV align=center>

<MARQUEE scrollDelay=60 direction=up behavior=alternate width="100%" height=160>

<DIV align=center><IMG height=140 src="

    本站是提供個人知識管理的網絡存儲空間，所有內容均由用戶發(fā)布，不代表本站觀點。請注意甄別內容中的聯(lián)系方式、誘導購買等信息，謹防詐騙。如發(fā)現有害或侵權內容，請點擊一鍵舉報。
    轉藏 分享 獻花（0）

    0條評論

    發(fā)表

    請遵守用戶 評論公約

    類似文章 更多