久久国产成人av_抖音国产毛片_a片网站免费观看_A片无码播放手机在线观看,色五月在线观看,亚洲精品m在线观看,女人自慰的免费网址,悠悠在线观看精品视频,一级日本片免费的,亚洲精品久,国产精品成人久久久久久久

搜索
分享

html特效代碼　　圖片滾動或圖片文字混合滾動

 賀江之畔信都人 2011-12-19
html特效代碼　　圖片滾動或圖片文字混合滾動
2011-03-31 23:34

本文介紹圖片滾動或圖片文字混合滾動,。

 1,、圖文相對滾動

你給獻玫瑰 玫瑰獻給你

代碼：

<div align=center><MARQUEE direction=right width=300 height=25>
<IMG src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_1.jpg ">
<FONT face=隸書 color=#ff0000  size=6>你給獻玫瑰
<IMG src=http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_2.jpg>
</FONT></MARQUEE></FONT> <MARQUEE width=300 height=25>
<IMG src=http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_2.jpg>
<FONT face=隸書 color=#ff0000 size=6>玫瑰獻給你
<IMG src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_1.jpg ">
</FONT></MARQUEE></div>

 2、圖文循環(huán)滾動 

輕輕的腳步,，我輕輕的踩。輕輕的我走了，我又輕輕的來,。 我想帶走天上那片云彩,，把河畔的金柳抱回去重栽。這里有我許多的夢想,，我不能空著手隨便離開,。

 代碼：

<div align=center><MARQUEE width=600 height=50  scrollamount="4">
<FONT face=隸書 color=#ff0000 size=5>輕輕的腳步，我輕輕的踩,。輕輕的我走了,，我又輕輕的來。
<IMG src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_3.jpg">
<FONT face=隸書 color=#ff0000 size=5>
我想帶走天上那片云彩,，把河畔的金柳抱回去重栽,。這里有我許多的夢想，我不能空著手隨便離開,。
</FONT></MARQUEE></div> 

 3,、飛舞的蝴蝶

填寫標(biāo)題填寫標(biāo)題填寫標(biāo)題

代碼：

<table width="400" border="0" align="center">
<tr><td><div align="center" >
填寫標(biāo)題填寫標(biāo)題填寫標(biāo)題
</div></td></tr></table>
<marquee behavior="alternate"scrollamount=10 direction=right>
<MARQUEE behavior=alternate direction=up height=200 width=120>
<img src=http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_4.jpg></MARQUEE>
<MARQUEE behavior=alternate direction=up height=250 width=120>
<img src=http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_4.jpg></MARQUEE>
<MARQUEE behavior=alternate direction=up height=200 width=120>
<img src=http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_4.jpg></MARQUEE>
<MARQUEE behavior=alternate direction=up height=250 width=120>
<img src=http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_4.jpg></MARQUEE>
<MARQUEE behavior=alternate direction=up height=200 width=120>
<img src=http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_4.jpg></MARQUEE>
<MARQUEE behavior=alternate direction=up height=250 width=120>

4、圖片在方框里飄動

飛吻

代碼：

<table width="450" border="0" align="center">
<tr><td><div align="center" >
飛吻（標(biāo)題）
</div></td></tr></table>
<table align=center border=0 bordercolor="#" width=450 height=250>
<td background=http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_29.jpg>
<marquee behavior=alternate scrollamount=3 direction=down width=445 height=245>
<marquee behavior=alternate scrollamount=3 width=450><font color=red size=6>
<img src=http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_5.jpg>
</font></marquee></marquee></td></table>

5,、圖片百葉窗式滾動

填寫標(biāo)題填寫標(biāo)題填寫標(biāo)題


代碼：

<table width="400" border="0" align="center">
<tr><td><div align="center" >
填寫標(biāo)題填寫標(biāo)題填寫標(biāo)題
</div></td></tr></table>
<br><TABLE cellSpacing=0 cellPadding=0 width="90%" align=center border=0>
<TBODY><TR><TD align=middle>
<MARQUEE scrollAmount=5 scrollDelay=50 direction=right width=150>
<IMG src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_6.jpg">
</MARQUEE></TD>
<TD align=middle>
<MARQUEE scrollAmount=5 scrollDelay=50 direction=right width=150>
<IMG src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_6.jpg">
</MARQUEE></TD>
<TD align=middle>
<MARQUEE scrollAmount=5 scrollDelay=50 direction=right width=150>
<IMG src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_6.jpg">
</MARQUEE></TD>
<TD align=middle>
<MARQUEE scrollAmount=5 scrollDelay=50 width=150>
<IMG src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_6.jpg">
</MARQUEE></TD>
<TD align=middle>
<MARQUEE scrollAmount=5 scrollDelay=50 width=150>
<IMG src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_6.jpg">
</MARQUEE></TD>
<TD align=middle>
<MARQUEE scrollAmount=5 scrollDelay=50 width=150>
<IMG src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_6.jpg">
</MARQUEE></TD></TR></TBODY></TABLE><BR><BR>

6,、多圖片交替跳躍

代碼：

<CENTER>
<MARQUEE direction=up behavior=alternate width=125 height=120>
<CENTER><img src=http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_7.jpg>
</CENTER></MARQUEE>
<MARQUEE direction=up behavior=alternate width=125>
<CENTER><img src=http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_7.jpg>
</CENTER></MARQUEE>
<MARQUEE direction=up behavior=alternate width=125 height=120>
<CENTER><img src=http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_7.jpg>
</CENTER></MARQUEE>
<MARQUEE direction=up behavior=alternate width=125>
<CENTER><img src=http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_7.jpg>
</CENTER></MARQUEE>
<MARQUEE direction=up behavior=alternate width=125 height=120>
<CENTER><img src=http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_7.jpg>
</CENTER></MARQUEE></MARQUEE></FONT></CENTER>

7、圖片在背景圖片上滾動

代碼：

<div align=center><table cellPadding=0 align=center
background=http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_30.jpg  border=2>
<tr><td><div>
<MARQUEE scrollAmount=4 direction=down width=490 height=296>
<MARQUEE scrollAmount=4 direction=up width=500 height=296>
<IMG style="FILTER: alpha WIDTH:500px; HEIGHT:296px"
src=http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_8.jpg>
</MARQUEE></MARQUEE></div></td></tr></table></div>

說明：做這樣的效果,，兩張圖片最好同樣大小,，如果圖片大小不等，將圖片修改一下,。需指出的是,，我這里的圖片都是500×300，參數(shù)大家照樣子設(shè)置即可,。500-10=490,，300-4=296，這里的10和4可以看著是固定的常數(shù),。

8,、多圖片循環(huán)滾動

代碼：

<DIV align="center">
<MARQUEE width=90% height=120 onmouseover=stop() onmouseout=start() scrollAmount=5 loop=infinite deplay="0">

<img src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_9.jpg">
<img src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_10.jpg">
<img src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_11.jpg">
<img src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_12.jpg">
<img src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_13.jpg">
<img src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_14.jpg">
<img src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_15.jpg">
<img src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_16.jpg">
<img src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_17.jpg">
<img src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_18.jpg">

</MARQUEE></DIV>

  9、多圖片在方框里循環(huán)滾動

　　　　　　　　　　　　　　　　　　　　　　　　這里寫標(biāo)題,，不用標(biāo)題可以刪除

　　　　　 

 

 

 

 

 

點擊最后一張試試 

-------------------------------------------------------------------------------------------

代碼：

<div align="center"><FONT face=宋體  color=#FF0000 size=4>
這里寫標(biāo)題,，不用標(biāo)題可以刪除
</div>
<TABLE width=780  border=1 align="center" cellPadding=0 cellSpacing=20 bordercolor="#CE4300" background=http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_31.jpg bgcolor="#FFBC9B">
<TBODY><TR><TD><TABLE width="100%" border=0 align="center" cellPadding=0 cellSpacing=5 background=http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_32.jpg>
<TBODY><TR><TD align=middle><TABLE width=780 height=150 border=3 align="center" bordercolor="#FF0000" background=http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_33.jpg bgcolor="#FFF2EC">
<TBODY><TR><TD><CENTER><P align=center><MARQUEE scrollAmount=4 width="100%" directio="left">

<IMG src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_19.jpg">
<IMG src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_20.jpg">
<IMG src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_21.jpg">
<IMG src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_22.jpg">
<IMG src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_23.jpg">
<IMG src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_24.jpg">
<IMG src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_25.jpg">
<IMG src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_26.jpg">
<IMG src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_27.jpg">
<IMG src="http://image48.360doc.com/DownloadImg/2011/12/1923/20154751_28.jpg">

</MARQUEE></P></CENTER></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>

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

    0條評論

    發(fā)表

    請遵守用戶 評論公約

    類似文章 更多