图片移动代码博客制做 2008-07-13 15:34:07 阅读426 评论8 字号:大中小 一、代码: <DIV style=" WIDTH: 100%"> <MARQUEE scrollAmount=2 scrollDelay=30 direction=left width="100%" height="128"> <A href="http://blog.163.com/ciq080416nfk@126/" target=_blank><IMG height=128 src="图片地址1" width=128 border=0></A> <A><IMG height=128 src="图片地址2" width=128 border=0></A> <A><IMG height=128 src="图片地址3" width=128 border=0></A> <A><IMG height=128 src="图片地址4" width=128 border=0></A> <A><IMG height=128 src="图片地址5" width=128 border=0></A> ...... <A><IMG height=128 src="图片地址n" width=128 border=0></A> </MARQUEE></DIV> 二、说明 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,是这张图片的宽度,是需要跟据自己的图片大小 进行调整的。 三、加入图片地址后的移动效果 代码: <DIV style=" WIDTH: 100%"> <MARQUEE scrollAmount=2 scrollDelay=30 direction=left width="100%" height="128"> <A href="http://blog.163.com/ciq080416nfk@126/" target=_blank><IMG height=128 src="http://image9.360doc.com/DownloadImg/2010/04/2809/3027914_1.jpg" width=128 border=0></A><A> <IMG height=128 src="http://img.blog.163.com/photo/oHJRJPqe- 1a3xIMycyDHJg==/1140818080609208228.jpg " width=128 border=0></A><A> <IMG height=128 src="http://image9.360doc.com/DownloadImg/2010/04/2809/3027914_3.jpg " width=128 border=0></A> <A><IMG height=128 src="http://image9.360doc.com/DownloadImg/2010/04/2809/3027914_4.jpg" width=128 border=0></A> <A><IMG height=128 src="http://image9.360doc.com/DownloadImg/2010/04/2809/3027914_5.jpg" width=128 border=0></A> <A><IMG height=128 src="http://img.blog.163.com/photo/69SrLvHNV-H-RHdlYdk- 3Q==/5077527104884019919.jpg " width=128 border=0></A> <A><IMG height=128 src="http://image9.360doc.com/DownloadImg/2010/04/2809/3027914_7.jpg " width=128 border=0></A> <A><IMG height=128 src="http://image9.360doc.com/DownloadImg/2010/04/2809/3027914_8.jpg" width=128 border=0></A> <A><IMG height=128 src="http://image9.360doc.com/DownloadImg/2010/04/2809/3027914_9.jpg" width=128 border=0></A> </MARQUEE></DIV> 以下两个与上面同效的图片滚动代码 1、(从右向左滚动) <marquee scrollamount=1 scrolldelay=3 valign=middle behavior="scroll"> <img border="0" src=" http://要滚动的图片地址1"> <img border="0" src=" http://要滚动的图片地址2"> </marquee> 2、 (从下往上滚动) <marquee align=center direction=up scrollamount=1 scrolldelay=3 valign=middle behavior="scroll"> <img border="0" src=" http://要滚动的图片地址1"> <img border="0" src=" http://要滚动的图片地址2"> </marquee> |
|