在图片上添加文字定位跳跃代码

效果图一代码

 

 

 

 

 

妈

妈

我

想

您

二效果图

春

天

真

来

了

 

 

 

 

 

 

 

 

 

请与博文《滚动文字特效代码集锦之二 》对比效果，我通过设置文字跳跃参数，巧妙地将文字进行了特别排列，并与背景图结合成新颖的表现形式。您可以用自己的照片或图片，换上想说的话制作一幅吧。我用不同风格的图片素材为背景制作2款效果图供朋友参考。因内容太多，无法提供效果图1和2的代码，建议您直接复制效果图查询代码。发挥你的智慧，创作出更美的佳作。

 

 

 

 

 

 

 

 

 

 

 

 

 

 

分享代码

效果图一代码

<DIV align=center>

<TABLE style="BORDER-RIGHT: #ff0000 10px ridge; BORDER-TOP: #ff0000 10px ridge; BORDER-LEFT: #ff0000 10px ridge; BORDER-BOTTOM: #ff0000 10px ridge; BACKGROUND-COLOR: #f5fffa" cellSpacing=30>

<TBODY>

<TR>

<TD>

<TABLE height=400 borderColorDark=red width=550 background=http://image38.360doc.com/DownloadImg/2011/10/0412/18221964_2.jpg border=3>

<TBODY>

<TR>

<TD>

<P>&nbsp;</P>

<P>&nbsp;</P>

<P>&nbsp;</P>

<P>&nbsp;</P>

<P>&nbsp;</P>

<DIV align=center>

<P style="MARGIN-TOP: 0px; MARGIN-LEFT: 30px" align=left><FONT color=red size=25>

<MARQUEE direction=up behavior=alternate width=60 height=120>妈</MARQUEE></FONT></P>

<P style="MARGIN-TOP: -20px; MARGIN-LEFT: 140px" align=left><FONT color=red size=25>

<MARQUEE direction=up behavior=alternate width=60 height=120>妈</MARQUEE></FONT></P>

<P style="MARGIN-TOP: -20px; MARGIN-LEFT: 250px" align=left><FONT color=red size=25>

<MARQUEE direction=up behavior=alternate width=60 height=120>我</MARQUEE></FONT></P>

<P style="MARGIN-TOP: -230px; MARGIN-LEFT:360px" align=left><FONT color=red size=25>

<MARQUEE direction=up behavior=alternate width=60 height=120>想</MARQUEE></FONT></P>

<P style="MARGIN-TOP: -230px; MARGIN-LEFT: 470px" align=left><FONT color=red size=25>

<MARQUEE direction=up behavior=alternate width=60 height=120>您</MARQUEE></FONT></P></DIV></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></DIV>二效果图

<DIV align=center>

<TABLE style="BORDER-RIGHT: #7fffd4 15px ridge; BORDER-TOP: #7fffd4 15px ridge; LEFT: 0px; OVERFLOW: hidden; BORDER-LEFT: #7fffd4 15px ridge; BORDER-BOTTOM: #7fffd4 15px ridge" height=600 cellSpacing=30 cellPadding=0 width=550 align=center background=http://image38.360doc.com/DownloadImg/2011/10/0412/18221964_3.gif border=0>

<TBODY>

<TR>

<TD>

<P align=center>&nbsp;<IMG src="http://image38.360doc.com/DownloadImg/2011/10/0412/18221964_1.jpg"></P>

<DIV align=center>

<P style="MARGIN-TOP: 0px; MARGIN-LEFT: 30px" align=left><FONT color=red size=25>

<MARQUEE direction=up behavior=alternate width=60 height=120>春</MARQUEE></FONT></P>

<P style="MARGIN-TOP: -20px; MARGIN-LEFT: 140px" align=left><FONT color=yellow size=25>

<MARQUEE direction=up behavior=alternate width=60 height=120>天</MARQUEE></FONT></P>

<P style="MARGIN-TOP: -20px; MARGIN-LEFT: 250px" align=left><FONT color=dodgerblue size=25>

<MARQUEE direction=up behavior=alternate width=60 height=120>真</MARQUEE></FONT></P>

<P style="MARGIN-TOP: -230px; MARGIN-LEFT:360px" align=left><FONT color=lime size=25>

<MARQUEE direction=up behavior=alternate width=60 height=120>来</MARQUEE></FONT></P>

<P style="MARGIN-TOP: -230px; MARGIN-LEFT: 470px" align=left><FONT color=fuchsia size=25>

<MARQUEE direction=up behavior=alternate width=60 height=120>了</MARQUEE></FONT></P></DIV>

<P>&nbsp;</P>

<P>&nbsp;</P>

<P>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</P>

<P>&nbsp;</P>

<P>&nbsp;</P>

<P>&nbsp;</P>

<P>&nbsp;</P>

<P>&nbsp;</P>

<P>&nbsp;</P>

<P align=left><FONT face=楷体_GB2312 color=#55f87e size=5><FONT face=宋体 color=#000000 size=3>&nbsp;&nbsp;&nbsp;</FONT>请与博文《滚动文字特效代码集锦之二 》对比效果，我通过设置文字跳跃参数，巧妙地将文字进行了特别排列，并与背景图结合成新颖的表现形式。您可以用自己的照片或图片，换上想说的话制作一幅吧。我用不同风格的图片素材为背景制作2款效果图供朋友参考。因内容太多，无法提供效果图1和2的代码，建议您直接复制效果图查询代码。发挥你的智慧，创作出更美的佳作。 </FONT></P>

<P align=left>&nbsp;</P></TD></TR></TBODY></TABLE></DIV>