图片移动代码大全代码

图片移动代码大全

代码

图片移动代码大全

从右向左移动：

从右向左移动

代码：

<MARQUEE scrollAmount=2><IMG src="http://image54.360doc.com/DownloadImg/2012/08/3114/26525116_1.gif"><BR>从右向左移动</MARQUEE>

从左向右移动：

从左向右移动

代码：

<MARQUEE scrollAmount=2 direction=right><IMG src=" http://image54.360doc.com/DownloadImg/2012/08/3114/26525116_1.gif"><BR>从左向右移动</MARQUEE>
图片向上移动：

代码：

图片向下移动：

代码：

图片左右来回移动 :

代码:
<P align=center>
<MARQUEE style="WIDTH: 500px; HEIGHT: 120px" scrollAmount=4 behavior=alternate><IMG src=" http://image54.360doc.com/DownloadImg/2012/08/3114/26525116_1.gif "></MARQUEE></P>

多图左右来回移动 :

代码：

多图从右往左移动：

说明：

direction=left 是图片的滚动方向，可以有四个方向，分别是left right up down，向左走，

direction=left 可以省去。来回走是把direction= 换成behavior=alternate。

width="100%" height="128" 这是模块整体的宽和高，在网易博客中宽度就设定为100%不用变，可以跟据模块摆放的位置自适应。高度可以跟据需要进行调整。

<A href="http://blog.163.com/ciq080416nfk@126/" target=_blank> 第一张图片前的这组命令和以后图片前的<A>是同一组命令，区别是加入了 href="" ，是点击图片打开指定链接网页，也可以在后面的图片上都加上链接。

target=_blank 是在新窗口打开的意思，没有这个命令就是在当前页打开。

<A href="" target=_blank>也可不用。

src="图片地址"，是调用这个链接地址的图片。

每一个图片链接后面都有一个 width=128，是这张图片的宽度，是需要跟据自己的图片大小进行调整的。

图片上下来回移动:

代码:

图片波浪式移动:

代码:
<MARQUEE style="WIDTH: 700px; HEIGHT: 200px" scrollAmount=2 direction=up behavior=alternate>
<MARQUEE direction=right><IMG src=" http://image54.360doc.com/DownloadImg/2012/08/3114/26525116_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://image54.360doc.com/DownloadImg/2012/08/3114/26525116_1.gif "></MARQUEE></MARQUEE>
图片波浪式来回移动（二）:

代码：

<DIV align=center>
<MARQUEE scrollAmount=2 behavior=alternate width=630 height=200>
<MARQUEE scrollAmount=2 direction=up width=195 height=192><IMG src="http://image54.360doc.com/DownloadImg/2012/08/3114/26525116_1.gif"></MARQUEE></MARQUEE></DIV>
图片由中间向两边移动:

代码:
<P align=center>
<MARQUEE style="WIDTH: 300px; HEIGHT: 150px" scrollAmount=2><IMG src=" http://image54.360doc.com/DownloadImg/2012/08/3114/26525116_1.gif "></MARQUEE>
<MARQUEE style="WIDTH: 300px; HEIGHT: 150px" scrollAmount=2 direction=right><IMG src=" http://image54.360doc.com/DownloadImg/2012/08/3114/26525116_1.gif "></MARQUEE></P>

图片由中间向两边移动:

-->

--> 代码：

图片上下向中间移动:

代码:

多图片上下向中间移动（二）:

代码：

图片从中间往上下分开：

代码：

图片从右往左移动(渐出):

代码：

<MARQUEE style="WIDTH: 685px; HEIGHT: 109px" behavior=alternate>
<MARQUEE width=150 scrollAmount=5><IMG src="http://image54.360doc.com/DownloadImg/2012/08/3114/26525116_1.gif"></MARQUEE></MARQUEE>
<P> </P>
图片从右往左移动（渐隐）:

代码：

图片从下往上移动（渐出）:

代码：

图片从下往上移动（渐出）:

代码：

图片从右下往左上飘移：

代码：

图片来回走走停停：

代码：

多图片向上移动：

代码：

(二)

图片对开移动：

代码：
<TABLE width=400 align=center>
<TBODY>
<TR>
<TD align=middle width=100>
<MARQUEE scrollAmount=1 direction=right><IMG src="http://image54.360doc.com/DownloadImg/2012/08/3114/26525116_6.jpg"></MARQUEE></TD>
<TD align=middle width=100>
<MARQUEE scrollAmount=1><IMG src="http://image54.360doc.com/DownloadImg/2012/08/3114/26525116_6.jpg"></MARQUEE></TD>
<TD align=middle width=100>
<MARQUEE scrollAmount=1 direction=right><IMG src="http://image54.360doc.com/DownloadImg/2012/08/3114/26525116_6.jpg"></MARQUEE></TD>
<TD align=middle width=100>
<MARQUEE scrollAmount=1><IMG src="http://image54.360doc.com/DownloadImg/2012/08/3114/26525116_6.jpg"></MARQUEE></TD></TR></TBODY></TABLE>

图片渐开渐合移动：

-->
-->

代码：

<TABLE cellSpacing=0 cellPadding=0 width=151 align=center border=0>
<TBODY>
<TR>
<TD align=middle>
<MARQUEE scrollAmount=1 scrollDelay=100 direction=right width=151><IMG src="http://image54.360doc.com/DownloadImg/2012/08/3114/26525116_1.gif"></MARQUEE></TD>
<TD align=middle>
<MARQUEE scrollAmount=1 scrollDelay=100 width=151><IMG src="http://image54.360doc.com/DownloadImg/2012/08/3114/26525116_1.gif"></MARQUEE></TD>
<TD align=middle>
<MARQUEE scrollAmount=1 scrollDelay=100 direction=right width=151><IMG src="http://image54.360doc.com/DownloadImg/2012/08/3114/26525116_1.gif"></MARQUEE></TD>
<TD align=middle>
<MARQUEE scrollAmount=1 scrollDelay=100 width=151><IMG src="http://image54.360doc.com/DownloadImg/2012/08/3114/26525116_1.gif"></MARQUEE></TD></TR></TBODY></TABLE>
图片展开和收起（一）：

代码：

图片展开和收起（二）：

代码：

图片移动特效+Flash ：

从左向右移动

代码：

<P>
<TABLE border=0 cellPadding=0 width=396 background=http://image54.360doc.com/DownloadImg/2012/08/3114/26525116_8.jpg align=center height=400>
<TBODY>
<TR>
<TD>
<DIV align=center>
<MARQUEE scrollAmount=2 height=400 width=596 direction=right><IMG style="FILTER: alpha WIDTH: 396px; HEIGHT: 400px" src=" http://image54.360doc.com/DownloadImg/2012/08/3114/26525116_8.jpg"><BR>从左向右移动</MARQUEE>
<P style="MARGIN-TOP: -410px; MARGIN-LEFT: 10px"></P><EMBED style="DISPLAY: block" height=400 type=application/x-shockwave-flash pluginspage=http://www.macromedia.com/go/getflashplayer width=350 src=http://pp6143.com.ne.kr/s52.swf quality="high" wmode="transparent" allowNetworking="internal" allowScriptAccess="never"></DIV></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></P>

参数详解：

1）scrollAmount。它表示速度，值越大速度越快。如果没有它，默认为6，建议设为1～3比较好。

2）width和height，表示滚动区域的大小，width是宽度，height是高度。特别是在做垂直滚动的时候，一定要设height的值。

3）direction。表示滚动的方向，默认为从右向左：←←←。可选的值有right、down、up。滚动方向分别为：right表示→→→，up表示↑，down表示↓。

4）scrollDelay，这也是用来控制速度的，默认为90，值越大，速度越慢。通常scrollDelay是不需要设置的。

5）behavior。用它来控制属性，默认为循环滚动，可选的值有alternate(交替滚动)、slide(幻灯片效果，指的是滚动一次，然后停止滚动)

注：移动宽度=图片宽度

鼠标指着就停止的移动图片代码：

代码：

说明：

onMouseOver=this.stop() onMouseOut=this.start() ——表示鼠标放到该对象上时移动停止,鼠标移开时又开始移动。

玖瑰花鼠标代码：

<P align=center> </P>
<BLOCKQUOTE></BLOCKQUOTE>
<STYLE>body{cursor:url(http://plugin.smileycentral.com/http%253a%252f%252fplugin%252esmileycentral%252ecom%252fassetserver%252fcursor%252ejhtml%253fcur%253d1%2526i%253d9646a/image.gif); }</STYLE>

贴/yb儿

图片移动代码大全

文章评论