打开APP
userphoto
未登录

开通VIP,畅享免费电子书等14项超值服

开通VIP
制作图片幻影移动效果的代码及实例3款

制作图片幻影移动效果的代码及实例3款  

 

 

效果图一

 

 

 

 

效果图二

 

 

 

 

 效果图三

 

 



 

图片素材一

 

 



 

图片素材二

 



 

图片素材三

 



 

图片素材四

 



 

图片素材五·

 




 图片素材六

 

 


注  

 

博文《制作图片重叠移动合成效果的代码及应用实例3款》中是单张图片反向移动透明效果,今天我将其设计成多图片移动,由于添加了半透明效果,所以在反向移动中,产生重叠、交错的幻影效果。我选用了不同风格和色彩的图片制作效果图供朋友们参考。替换图片预览满意即可发表。红色代码是相同图片素材地址,绿色代码是相同图片素材地址。代码设计只是技巧,最重要的是构思创意。发挥您的智慧,创作出更美的佳作
特别说明:图片素材来源于网络。

 

 

 

 

 

点击图片看昭昭 
公主的文字博客

  

 

 

 

效果图一代码

<DIV align=center>
<MARQUEE style="WIDTH: 100%" scrollAmount=2 behavior=alternate height=420><IMG height=420 src="http://s11.sinaimg.cn/orignal/5e1a7abfg92933602a80a&690"><IMG height=420 src="http://s3.sinaimg.cn/orignal/5e1a7abfg9293363a0e72&690"><IMG height=420 src="http://s11.sinaimg.cn/orignal/5e1a7abfg92933602a80a&690"><IMG height=420 src="http://s3.sinaimg.cn/orignal/5e1a7abfg9293363a0e72&690"><IMG height=420 src="http://s11.sinaimg.cn/orignal/5e1a7abfg92933602a80a&690"><IMG height=420 src="http://s3.sinaimg.cn/orignal/5e1a7abfg9293363a0e72&690"></MARQUEE></DIV>
<DIV style="MARGIN-TOP: -420px; MARGIN-LEFT: 0px">
<MARQUEE style="WIDTH: 100%" scrollAmount=2 direction=right behavior=alternate height=420><IMG style="FILTER: Alpha(opacity=50)" height=420 src="http://s11.sinaimg.cn/orignal/5e1a7abfg92933602a80a&690"><IMG style="FILTER: Alpha(opacity=50)" height=420 src="http://s3.sinaimg.cn/orignal/5e1a7abfg9293363a0e72&690"><IMG style="FILTER: Alpha(opacity=50)" height=420 src="http://s11.sinaimg.cn/orignal/5e1a7abfg92933602a80a&690"><IMG style="FILTER: Alpha(opacity=50)" height=420 src="http://s3.sinaimg.cn/orignal/5e1a7abfg9293363a0e72&690"><IMG style="FILTER: Alpha(opacity=50)" height=420 src="http://s11.sinaimg.cn/orignal/5e1a7abfg92933602a80a&690"><IMG style="FILTER: Alpha(opacity=50)" height=420 src="http://s3.sinaimg.cn/orignal/5e1a7abfg9293363a0e72&690"></MARQUEE></DIV>

 
  

效果图二代码

<DIV align=center>
<MARQUEE style="WIDTH: 100%" scrollAmount=2 behavior=alternate height=450><IMG height=450 src="http://s16.sinaimg.cn/orignal/5e1a7abfg929335edcdcf&690'%3E%3CIMG height=450 src="http://static2.photo.sina.com.cn/orignal/5e1a7abfg929336115081&690'%3E%3CIMG height=450 src="http://s16.sinaimg.cn/orignal/5e1a7abfg929335edcdcf&690'%3E%3CIMG height=450 src="http://static2.photo.sina.com.cn/orignal/5e1a7abfg929336115081&690'%3E%3CIMG height=450 src="http://s16.sinaimg.cn/orignal/5e1a7abfg929335edcdcf&690'%3E%3CIMG height=450 src="http://static2.photo.sina.com.cn/orignal/5e1a7abfg929336115081&690'%3E%3C/MARQUEE%3E%3C/DIV>
<DIV style="MARGIN-TOP: -450px; MARGIN-LEFT: 0px">
<MARQUEE style="WIDTH: 100%" scrollAmount=2 direction=right behavior=alternate height=450><IMG style="FILTER: Alpha(opacity=50)" height=450 src="http://s16.sinaimg.cn/orignal/5e1a7abfg929335edcdcf&690'%3E%3CIMG style="FILTER: Alpha(opacity=50)" height=450 src="http://static2.photo.sina.com.cn/orignal/5e1a7abfg929336115081&690'%3E%3CIMG style="FILTER: Alpha(opacity=50)" height=450 src="http://s16.sinaimg.cn/orignal/5e1a7abfg929335edcdcf&690'%3E%3CIMG style="FILTER: Alpha(opacity=50)" height=450 src="http://static2.photo.sina.com.cn/orignal/5e1a7abfg929336115081&690'%3E%3CIMG style="FILTER: Alpha(opacity=50)" height=450 src="http://s16.sinaimg.cn/orignal/5e1a7abfg929335edcdcf&690'%3E%3CIMG style="FILTER: Alpha(opacity=50)" height=450 src="http://static2.photo.sina.com.cn/orignal/5e1a7abfg929336115081&690'%3E%3C/MARQUEE%3E%3C/DIV>

 

 

效果图三代码

<DIV align=center>
<MARQUEE style="WIDTH: 100%" scrollAmount=2 behavior=alternate height=418><IMG height=418 src="http://static10.photo.sina.com.cn/orignal/5e1a7abfg92933635b069&690'%3E%3CIMG height=418 src="http://s10.sinaimg.cn/orignal/5e1a7abfg9293360b7a39&690'%3E%3CIMG height=418 src="http://static10.photo.sina.com.cn/orignal/5e1a7abfg92933635b069&690'%3E%3CIMG height=418 src="http://s10.sinaimg.cn/orignal/5e1a7abfg9293360b7a39&690'%3E%3CIMG height=418 src="http://static10.photo.sina.com.cn/orignal/5e1a7abfg92933635b069&690'%3E%3CIMG height=418 src="http://s10.sinaimg.cn/orignal/5e1a7abfg9293360b7a39&690'%3E%3C/MARQUEE%3E%3C/DIV>
<DIV style="MARGIN-TOP: -418px; MARGIN-LEFT: 0px">
<MARQUEE style="WIDTH: 100%" scrollAmount=2 direction=right behavior=alternate height=418><IMG style="FILTER: Alpha(opacity=50)" height=418 src="http://static10.photo.sina.com.cn/orignal/5e1a7abfg92933635b069&690'%3E%3CIMG style="FILTER: Alpha(opacity=50)" height=418 src="http://s10.sinaimg.cn/orignal/5e1a7abfg9293360b7a39&690'%3E%3CIMG style="FILTER: Alpha(opacity=50)" height=418 src="http://static10.photo.sina.com.cn/orignal/5e1a7abfg92933635b069&690'%3E%3CIMG style="FILTER: Alpha(opacity=50)" height=418 src="http://s10.sinaimg.cn/orignal/5e1a7abfg9293360b7a39&690'%3E%3CIMG style="FILTER: Alpha(opacity=50)" height=418 src="http://static10.photo.sina.com.cn/orignal/5e1a7abfg92933635b069&690'%3E%3CIMG style="FILTER: Alpha(opacity=50)" height=418 src="http://s10.sinaimg.cn/orignal/5e1a7abfg9293360b7a39&690'%3E%3C/MARQUEE%3E%3C/DIV>

   
本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请点击举报
打开APP,阅读全文并永久保存 查看更多类似文章
猜你喜欢
类似文章
【热】打开小程序,算一算2024你的财运
幻影移动图片及代码(缤纷音乐103首)
用代码制作幻影移动图片
制作移动闪动边框的代码及应用实例3款
制作在边框内梦幻图片移动的代码及实例
图片幻影移动代码
制作多图平面移动的代码
更多类似文章 >>
生活服务
热点新闻
分享 收藏 导长图 关注 下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!

联系客服