注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

费家村----老费的三角梅花园

科学、民主、竞争是科技和社会进步的法宝

 
 
 

日志

 
 

图片、文字运动代码及效果  

2009-02-26 12:56:18|  分类: 代码/博客 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

图片、文字运动代码及效果

一、基本语法和属性设置:

1、基本语法:<marquee> ... </marquee>

2、属性设置代码意义:

速度: scrollamount=#    #=数字  越大越快

方式: behavior=#     #=scroll:翻覆, slide:一次, alternate:来回循环

方向: direction=#    #=left:向左,   right:向右,  down:向下,   up:向上 。

次数:loop=#   #=数字   若未指定则循环不止(infinite)

背景颜色:bgcolor=#FF0000   #=颜色代码

 

二、向右运动代码及效果

1、<marquee direction=right>文字左向右运动</marquee>

文字左向右运动

2、<MARQUEE scrollAmount=2 scrollDelay=30 direction=right width="90%" height=100><IMG height=100 src="

图片地址" width=100 border=0><IMG height=100 src="图片地址" width=100 border=0></MARQUEE

效果:

图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园

    3、移动的友情链接代码向右运动   点击图片,打开对方地址。

<marquee behavior="scroll" direction=right width="90%" height="100" scrollamount="2" scrolldelay="30" >

<a target="cont" href="对方地址"><img src="图片地址"></a>

<a target="cont" href="对方地址"><img src="图片地址"></a></marquee>

效果:(没有做链接对方地址)

图片、文字运动代码及效果 - fdycq - 费家村----老费的三角梅花园 图片、文字运动代码及效果 - fdycq - 费家村----老费的三角梅花园

三、向左运动代码及效果(一)

1、 <marquee direction=left>文字右向左运动</marquee>

文字右向左运动!

2、<MARQUEE style="FONT-SIZE: 35pt; FILTER: shadow(color   =black); WIDTH: 100%; COLOR: #0000ff; LINE-HEIGHT: 150%; FONT-FAMILY: 華文彩云" scrollAmount=6><FONT color=#ff00ff><B>向左运动</B></FONT></MARQUEE>

向左运动   

代码及效果(二)

<MARQUEE style="FONT-SIZE: 35pt; FILTER: shadow(color   =black); WIDTH: 100%">

<P style="TEXT-INDENT: 2em"><IMG src="图片地址" border=0></P></MARQUEE>

图片、文字运动代码及效果 - fdycq - 费家村----老费的花园

四、左右来回运动代码

1、文字图片的左右来回运动代码和效果

<MARQUEE scrollAmount=2 scrollDelay=60 behavior=alternate turespeed="true" border="0"><IMG 

src="图片地址"><font  color=#1E90FF size="6"><b> 左右来回运动><IMG 

src="图片地址"></MARQUEE>

图片、文字运动代码及效果 - fdycq - 费家村----老费的三角梅花园左右来回运动三角梅左右移动自定义模块代码 - fdycq - 费家村----老费的三角梅花园

 2、图片的左右来回运动代码和效果

<MARQUEE scrollAmount=2 scrollDelay=60 behavior=alternate turespeed="true" border="5"><IMG height=100 src="图片地址[/img" width=100 border=0><IMG height=100 src="图片地址[/img" width=100 border=0></A></MARQUEE>

图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园

上图地址为: http://img.blog.163.com/photo/jPILDC0iBrIxuJtoFdCFEQ==/4559331672759492112.jpg

3、连续多张图片的左右来回运动代码和效果

<MARQUEE scrollAmount=2 scrollDelay=60 behavior=alternate turespeed="true" border="0"><IMG 

src="图片地址"><IMG 

src="图片地址"></MARQUEE>

连续多张效果: 三角梅左右移动自定义模块代码 - fdycq - 费家村----老费的三角梅花园三角梅左右移动自定义模块代码 - fdycq - 费家村----老费的三角梅花园

 五、上下滚动代码

 1、向上

<MARQUEE style="FONT-SIZE: 12px; WIDTH: 132px; COLOR: rgb(34,34,221); LINE-HEIGHT: 17px; HEIGHT: 125px" scrollAmount=1 scrollDelay=1 direction=up height=125>这里是文字<BR></MARQUEE>

 效果

这里是滚动文字

 连续图片滚动的代码:

<CENTER><MARQUEE direction=UP width=250 height=330> <IMG src="图片地址" width=250><IMG src="图片地址" width=250><IMG src="图片地址" width=250><IMG src="图片地址" width=250><IMG src="图片地址" width=250><IMG src="图片地址" width=250><IMG src="图片地址" width=250></MARQUEE></CENTER>

效果:

图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园

 2、向下

<MARQUEE style="FONT-SIZE: 12px; WIDTH: 132px; COLOR: rgb(34,34,221); LINE-HEIGHT: 17px; HEIGHT: 125px" scrollAmount=1 scrollDelay=1 direction=down height=125>这里是文字<BR></MARQUEE>

 六、有背景的图片文字连体运动代码:

<TABLE style=" HEIGHT: 164px" borderColor=#00fa9a height=164 width=706 align=center background=背景图片地址 border=3>

<TBODY>

<TR>

<TD>

<MARQUEE scrollAmount=3 direction=down behavior=alternate height=150>

<MARQUEE scrollAmount=3 behavior=alternate width=750><IMG src="图片地址"><FONT face=华文行楷 color=#800080 size=30><B><FONT face=楷体_GB2312 color=#00ffff>要写的文字</FONT><IMG src="图片地址"></B></FONT></MARQUEE>

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

效果

图片、文字运动代码及效果 - fdycq - 费家村----老费的花园要写的文字图片、文字运动代码及效果 - fdycq - 费家村----老费的花园
七、图片文字连体波浪运动代码:

实质:波浪运动是上下、左右运动的合成。代码是上下运动代码设置与左右运动代码设置的结合。

<MARQUEE scrollAmount=3 direction=down behavior=alternate height=150>

<MARQUEE scrollAmount=3 behavior=alternate width=750>

<IMG src="图片地址"><FONT face=华文行楷 color=#800080 size=30><B><FONT face=楷体_GB2312 color=#00ffff>文字</FONT><IMG src="图片地址"></B></FONT></MARQUEE>

图片文字连体波浪运动效果:

 

图片、文字运动代码及效果 - fdycq - 费家村----老费的花园文字图片、文字运动代码及效果 - fdycq - 费家村----老费的花园

 八、合成梦幻图片的代码:

<TABLE height=463 width=330 align=center background=背景图片地址 table>
<TBODY>
<TR>
<TD>
<MARQUEE scrollAmount=2>
<TABLE style="FILTER: Alpha(opacity=300,style=2)" height=463 width=330 align=center background=梦幻图片地址 table>
<TBODY>
<TR>
<TD></TD></TR></TBODY></TABLE></MARQUEE></TD></TR></TBODY></TABLE>

效果:

来源:大海胸怀如何合成梦幻图片【原创】

九、两边向内移动图片代码

<marquee scrollamount="1" scrolldelay="50" direction="right" width="173"><img src="图片地址" /></marquee><marquee scrollamount="1" scrolldelay="50" width="172"><img src="图片地址" /></marquee><marquee scrollamount="1" scrolldelay="50" direction="right" width="172" /> 

 效果:

  图片、文字运动代码及效果 - fdycq - 费家村----老费的花园 图片、文字运动代码及效果 - fdycq - 费家村----老费的花园            

     十、多图重叠移动代码及效果图 

代码:<TABLE cellSpacing=0 cellPadding=0 width=600 align=center background=背景图片地址 border=0>

<TBODY>

<TR>

<TD>

<TABLE cellSpacing=0 cellPadding=0 align=center border=0>

<MARQUEE scrollAmount=1 scrollDelay=30 direction=right width=300><IMG height=450 src="移动图片地址" width=400></SPAN></MARQUEE>

<MARQUEE scrollAmount=1 scrollDelay=30 width=300><IMG height=450 src="移动图片地址" width=400></SPAN></MARQUEE>

<TBODY></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>

 效果: 

图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园

 十一、框内多图移动代码及效果

代码:

<TABLE style="BORDER-RIGHT:DARKRED 7px dashed;BORDER-TOP:DARKRED 7px dashed;BORDER-LEFT:DARKRED 7px dashed;BORDER-BOTTOM:DARKRED 7px dashed" cellSpacing=0 cellPadding=0 width=550 bgColor=#339933 border=0><TBODY><TR><TD><marquee behavior="scroll" direction=down width="177" height="220" scrollamount="3"  onmouseout="this.start()"><img src="图片地址 "><img src="图片地址"><img src="图片地址 "><img src="图片地址"><img src="图片地址 "><img src="图片地址"><img src="图片地址"><img src="图片地址"><img src="图片地址"><img src="图片地址"></marquee><MARQUEE width=177 height=220 onmouseover=stop() onmouseout=start() scrollAmount=3 loop=infinite deplay="0"><img src="图片地址 "><img src="图片地址 "><img src="图片地址"><img src="图片地址"><img src="图片地址 "><img src="图片地址"><img src="图片地址"><img src="图片地址"><img src="图片地址"><img

src="图片地址"><img src="图片地址"></MARQUEE><marquee behavior="scroll" direction=up width="177" height="220" scrollamount="3"  onmouseout="this.start()"><img src="图片地址 "><img src="图片地址 "><img src="图片地址 "><img src="图片地址"><img src="图片地址"><img src="图片地址 "><img src="图片地址 "><img src="图片地址"><img src="图片地址 "><img src="图片地址"></marquee>

效果图

图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园 图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园 图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园图片、文字运动代码及效果 - fdycq - 费家村----老费的花园

 

 

 

 十二、其他

代码:<MARQUEE scrollAmount=1 behavior=alternate>
<TABLE style="WIDTH: 493px; HEIGHT: 389px" borderColor=#00fa9a height=389 width=493 align=center border=3>
<TBODY>
<TR>
<TD>
<CENTER>
<TABLE style="BACKGROUND-IMAGE: url(http://img.bimg.126.net/photo/oIlA6x8CMtbmT3-5DY_S2g==/4819133076263421153.jpg%20+$)%20+$)+)++); WIDTH: 460px; BORDER-BOTTOM-STYLE: outset; outset: ; ridge: " cellSpacing=4 FONT>
<TBODY>
<TR>
<TD>
<P>&nbsp;</P>
<P>&nbsp;</P>
<P>&nbsp;</P>
<P>&nbsp;</P>
<P>&nbsp;</P>
<P>&nbsp;</P>
<P>&nbsp;</P>
<P>&nbsp;</P>
<P>&nbsp;</P>
<P>&nbsp;</P></TD></TR></TBODY></TABLE></CENTER></TD></TR></TBODY></TABLE></MARQUEE></P>

 

 

 

 

 

 

 

 

 

 

 代码:<DIV>
<TABLE style="WIDTH: 654px; HEIGHT: 446px">
<TBODY>
<TR>
<TD></TD>
<TD>
<DIV>,
<MARQUEE scrollAmount=3 scrollDelay=3 direction=right behavior=alternate valign="middle">
<TABLE style="BACKGROUND-IMAGE: url(http://img.bimg.126.net/photo/fGVGP8sWuq4Nm8VDshV8eQ==/4522458450811560916.jpg+)+%20++$); WIDTH: 920px; HEIGHT: 380px; BORDER-BOTTOM-STYLE: outset; outset: ; ridge: " cellSpacing=4 align=center FONT>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#8b0000 align=center border=0>
<TBODY></TBODY></TABLE></TD></TR></TBODY></TABLE>
<P></P></MARQUEE></DIV></TD></TR></TBODY></TABLE></DIV></CENTER></DIV>

,

代码:

<TABLE style="WIDTH: 480px; HEIGHT: 300px" height=300 cellPadding=0 width=480 align=center background=http://img.blog.163.com/photo/DqpYjS5SYVzZokqzq0yMMQ==/3419358017081348070.jpg border=0>
<TBODY>
<TR>
<TD>
<EMBED   pluginspage=http://www.macromedia.com/go/getflashplayer src=http://imgfree.21cn.com/free/flash/51.swf width="100%" type=application/x-shockwave-flash quality="high" wmode="transparent" ></EMBED>

<DIV align=center><FONT face=楷体_GB2312><FONT size=4><FONT color=#ffffff></FONT></FONT></FONT>
<MARQUEE style="WIDTH: 435px; HEIGHT: 84px" scrollAmount=2 direction=up height=84><FONT color=#00ff00 face=隶书 size=5>
<DIV align=center><FONT face=华文行楷 color=ff0000 size=6>欢迎光大海胸怀博客乐园</FONT></DIV>
<DIV align=center>&nbsp;</DIV>
<DIV align=center>是网络将我们联系在一起</DIV>
<DIV align=center>是缘让我们相识</DIV>
<DIV align=center>让我们在这博客的乐园中</DIV>
<DIV align=center>携手谱写快乐篇章儿</DIV>
<DIV align=center>&nbsp;</DIV></FONT></MARQUEE>
</TR></TBODY></TABLE>

效果:

,
欢迎光大海胸怀博客乐园
 
是网络将我们联系在一起
是缘让我们相识
让我们在这博客的乐园中
携手谱写快乐篇章儿
 
  评论这张
 
阅读(930)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017