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

长城的博客jsxhscc-163

交流会友的平台 赏心悦目的家园

 
 
 

日志

 
 
关于我

曾经当过兵,难忘军旅情。 宠辱不惊,闲看庭前花开花落。去留无意,漫观天外云卷云舒。

网易考拉推荐

【代码应用】移动图片效果及代码 (值得收藏)  

2010-11-08 14:15:15|  分类: 素材技巧 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

                 单张图片移动效果

【代码说明】(scrollAmount 移动速度,数值越大,速度越快;direction是移动方向。

向左移动效果

基本图片移动效果代码[引] - huchosan - huchosan的博客

向左移动代码

<marquee   scrollamount="2" direction=LEFT><img src=图片地址> </marquee>

向右移动效果

基本图片移动效果代码[引] - huchosan - huchosan的博客

向右移动代码

<marquee  scrollAmount=2  direction=right><img src=图片地址 ></marquee>

向上移动效果

基本图片移动效果代码[引] - huchosan - huchosan的博客

向上移动代码

<marquee  scrollAmount=2  direction=up><img src=图片地址 width=200 height=160></marquee>

向下移动效果

基本图片移动效果代码[引] - huchosan - huchosan的博客

向下移动代码

<marquee  scrollAmount=2  direction=down><img src=图片地址 width=200 height=160></marquee>

【代码说明】(scrollAmount移动速度,数值越大,速度越快;direction是移动方向,width图片的宽度;height图片要移动的上下距离)

来回移动效果

基本图片移动效果代码[引] - huchosan - huchosan的博客

来回移动代码

<marquee scrollamount="2" width=100% behavior=alternate><img src="图片地址"></marquee>

分段向上移动效果

基本图片移动效果代码[引] - huchosan - huchosan的博客

分段向上移动代码

<MARQUEE scrollAmount=2 direction=up behavior=alternate height=250><MARQUEE scrollAmount=2 direction=up height=229> <DIV align=center><IMG src="图片地址"></DIV></MARQUEE></MARQUEE>

左右摇摆向上移动效果

基本图片移动效果代码[引] - huchosan - huchosan的博客

左右摇摆向上代码

<MARQUEE scrollAmount=2 behavior=alternate width=285 height=200>

<MARQUEE scrollAmount=2 direction=up width=280 height=200><IMG src="图片地址">

</MARQUEE></MARQUEE>

图片缓慢出现效果

【代码说明】(scrollAmount移动速度,数值越大,速度越快;direction是移动方向。

向下效果

vior="slide" height=160> vior="slide" height=160>

基本图片移动效果代码[引] - huchosan - huchosan的博客

向下代码

<MARQUEE scrollAmount=3 direction=down behavior=slide height=160>

<MARQUEE scrollAmount=3 direction=up behavior=slide height=160>

<DIV align=center><IMG src="图片地址"> </DIV></MARQUEE></MARQUEE>

向上效果

vior="slide" height=160> vior="slide" height=160>

基本图片移动效果代码[引] - huchosan - huchosan的博客

向上代码

<MARQUEE scrollAmount=3 direction=up  behavior=slide height=160>

<MARQUEE scrollAmount=3 direction=down behavior=slide height=160>

<DIV align=center><IMG src="图片地址">

</DIV></MARQUEE></MARQUEE>

向右效果

vior=slide> vior=slide>

基本图片移动效果代码[引] - huchosan - huchosan的博客

向右代码

<MARQUEE scrollAmount=3 direction=right   behavior=slide >

<MARQUEE scrollAmount=3 direction=left behavior=slide>

<DIV align=center><IMG src="图片地址">

</DIV></MARQUEE></MARQUEE>

向左效果

vior=slide> vior=slide>

基本图片移动效果代码[引] - huchosan - huchosan的博客

向左代码

<MARQUEE scrollAmount=3 direction=left behavior=slide >

<MARQUEE scrollAmount=3 direction=right behavior=slide >

<DIV align=center><IMG src="地址">

</DIV></MARQUEE></MARQUEE>

图片缓慢出现循环效果

【代码说明】(scrollAmount移动速度,数值越大,速度越快;direction是移动方向。

从上到下效果

基本图片移动效果代码[引] - huchosan - huchosan的博客

从上到下代码

<MARQUEE scrollAmount=3 direction=down >

<MARQUEE scrollAmount=3 direction=up >

<DIV align=center><IMG src="地址">

</DIV></MARQUEE></MARQUEE>

从下到上效果

基本图片移动效果代码[引] - huchosan - huchosan的博客

从下到上代码

<MARQUEE scrollAmount=3 direction=up >

<MARQUEE scrollAmount=3 direction=down >

<DIV align=center><IMG src="地址">

</DIV></MARQUEE></MARQUEE>

从左到右效果

基本图片移动效果代码[引] - huchosan - huchosan的博客

从左到右代码

<MARQUEE scrollAmount=3 direction=right width=280 ><MARQUEE scrollAmount=3 direction=left width=280 ><DIV align=center><IMG src="图片地址"></DIV></MARQUEE></MARQUEE>

从右到左效果

基本图片移动效果代码[引] - huchosan - huchosan的博客

从右到左代码

<MARQUEE scrollAmount=3 direction=left width=300 ><MARQUEE scrollAmount=3 direction=right width=300 ><DIV align=center><IMG src="图片地"></DIV></MARQUEE></MARQUEE>

 

多张图片移动效果

【代码说明】 在单张图片移动效果的基础上,连续插入新的图片地址代码,把代码添加在最后一个前面。

多张图片向左移动效果

基本图片移动效果代码[引] - huchosan - huchosan的博客 基本图片移动效果代码[引] - huchosan - huchosan的博客 基本图片移动效果代码[引] - huchosan - huchosan的博客 基本图片移动效果代码[引] - huchosan - huchosan的博客

多张图片向左移动代码

<marquee direction=left width=宽度> <img src="第一张图片地址"><img src="第二张图片地址"> <img src="第三张图片地址"> <img src="第四张图片地址"> </marquee>

多张图片移动加链接地址效果

【代码说明】

在多张图片移动效果的基础上,在图片地址前加上你要链接到的目的地址。

效果

基本图片移动效果代码[引] - huchosan - huchosan的博客

基本图片移动效果代码[引] - huchosan - huchosan的博客

代码

<MARQUEE scrollAmount=2 scrollDelay=60 direction=up width=200 height=200><DIV align=center><A href=" 第一个链接的地址" target=_blank><IMG src="第一张图片地址" width=200 border=0></A></DIV><DIV align=center><A href="第二个链接地址/" target=_blank><IMG src=" 第二张图片地址" width=200 border=0></A></DIV></MARQUEE>

图片移动加FLASH特效

效果

代码

<MARQUEE scrollAmount=3 directio="down">

<TABLE borderColor=#000000 cellSpacing=0 cellPadding=0 background=图片地址 border=0>

<TBODY>

<TR>

<TD><EMBED src=FLASH地址  width=200 height=160 type=application/x-shockwave-flash wmode="transparent" menu="false" quality="high" allowNetworking="internal" allowScriptAccess="never"></EMBED> </TD></TR></TBODY></TABLE> </MARQUEE>

百叶窗移动效果

效果

基本图片移动效果代码[引] - huchosan - huchosan的博客 基本图片移动效果代码[引] - huchosan - huchosan的博客 基本图片移动效果代码[引] - huchosan - huchosan的博客 基本图片移动效果代码[引] - huchosan - huchosan的博客

代码

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

<TBODY>

<TR>

<TD align=middle>

<MARQUEE scrollAmount=1 scrollDelay=100 direction=right width=50><IMG src="第一个图片地址"></MARQUEE></TD>

<TD align=middle>

<MARQUEE scrollAmount=1 scrollDelay=100 width=50><IMG src="第二个图片地址"></MARQUEE></TD>

<TD align=middle>

<MARQUEE scrollAmount=1 scrollDelay=100 direction=right width=50><IMG src="第三个图片地址"></MARQUEE></TD>

<TD align=middle>

<MARQUEE scrollAmount=1 scrollDelay=100 width=50><IMG src="第四个图片地址"></MARQUEE></TD></TR></TBODY></TABLE>

特殊移动效果

上下起伏移动效果

基本图片移动效果代码[引] - huchosan - huchosan的博客基本图片移动效果代码[引] - huchosan - huchosan的博客

上下起伏移动代码

<marquee direction=left><marqueescrollamount="2"  behavior=alternate direction=up height=200><img src=图片地址><img src=图片地址> </marquee></marquee>

中间向两边移动效果

基本图片移动效果代码[引] - huchosan - huchosan的博客 基本图片移动效果代码[引] - huchosan - huchosan的博客

中间向两边移动代码

<marquee direction=left><marqueescrollamount="2"  behavior=alternate direction=up height=200><img src=图片地址><img src=图片地址> </marquee></marquee>

中间上下移动效果

基本图片移动效果代码[引] - huchosan - huchosan的博客

基本图片移动效果代码[引] - huchosan - huchosan的博客

中间上下移动代码

<MARQUEE scrollAmount=3 direction=up  height=100>

<CENTER>

<DIV style="FILTER: flipv"><IMG src="图片地址" width=72></DIV></CENTER></MARQUEE>

<MARQUEE scrollAmount=3 direction=down  height=100>

<CENTER>

<DIV style="FILTER: flipv"><IMG src="图片地址" width=72></DIV></CENTER></MARQUEE>

(引自 祝歌 的 博客)

  评论这张
 
阅读(612)| 评论(13)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

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

页脚

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