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

浅草细浪

读书、赏画、听曲、交流。

 
 
 

日志

 
 

【博客技巧】装饰性很强的多图无隙移动的方法&代码  

2012-08-06 21:02:54|  分类: 博客技巧 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

 
 
装饰性很强的多图无隙移动的方法&代码 
 
 
 
           
   

 

 

<CENTER>
<MARQUEE style="POSITION: relative;
WIDTH: 600px; HEIGHT: 300px;

TOP: 0px; LEFT: 0px"

 direction=right scrollAmount=3 scrollDelay=1>
<DIV style="POSITION: relative; WIDTH: 2400px; HEIGHT: 300px; TOP: 0px;

LEFT: 0px">
<TABLE style="POSITION: absolute;
WIDTH: 4000px; HEIGHT: 300px;

TOP: 0px; LEFT: -1200px"

border=0 cellSpacing=0 cellPadding=0>
<TBODY>
<TR>
<TD style="WIDTH: 500px" background=
第一张图片地址> </TD>
<TD style="WIDTH: 500px" background=第二张图片地址
> </TD>
<TD style="WIDTH: 500px" background=
第三张图片地址> </TD>
<TD style="WIDTH: 500px"
background=第四张图片地址> </TD>
<TD style="WIDTH: 500px" background=
第五张图片地址> </TD>
<TD style="WIDTH: 500px" background=
第六张图片地址>    </TD>
<TD style="WIDTH: 500px" background=
第七张图片地址>    </TD>
<TD style="WIDTH: 500px" background=
第八张图片地址> </TD></TR></TBODY></TABLE></DIV></MARQUEE></CENTER></TD>

</TR></TBODY></TABLE></CENTER>

 
 
代码说明

   1.WIDTH: 600px(显示窗口宽度),HEIGHT:300px(显示窗口高度)

   2. direction=" right" (图片移动的方向)

   3. scrollAmount="3"  (图片移动速度)

   4. WIDTH: 2400px; HEIGHT: 300px (显示图片总长减去窗口长度500*6-600、

高度400)

   5. WIDTH: 4000px; HEIGHT: 300px (图片的总长度500*8、高度300

   6.  style="WIDTH: 500px;" background="第一张图片地址"

(每张图片的宽度和图片网址)

   7. 为了使图片循环移动中间没有空白,图片1和图片7用同一张

图片2和图片8,用同一张

   8.以上说明的数字、方向、速度、图片的多少等要根据自己所用图片的

情况和需要来改变。

 

 

   

 

 

                                                         浅草细浪网易博客                                      

 

 

 

 

   

  评论这张
 
阅读(758)| 评论(3)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

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

页脚

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