淘宝天猫实现免CSS3自动跑马灯动态海报效果代码生成器使用教程

淘宝海报上自动全屏跑马灯那种效果如何做呢?鼠标不用放上去就会自动左右跳动，像GIF一样，但是又是不同组图片之间跳动。这种效果需要多组图片组合一起看效果更明显哦。下面来个效果预览图

这个免CSS3自动跑马灯效果就是上面效果图这样子的，那么要怎么实现呢，实现方法很简单，所以小编就直接写一个图文教程给大家。

首先需要先设计准备好图片：跑马灯的图片，首页要准备好两张图片一张默认显示的，一张是变的也就是跑马时看到的动态的那另一张叫焦点图，图片格式不限，可以做png透明的，也可以做jpg的。具体参考下方演示图

第一张图是默认显示图 ，                                                               第二张图是焦点图

这两张图片一定要设计不一样的，不然会没有效果的哈，也就没有变化，图片先上传图片空间复制图片空间图片地址到放软件里替换图片地址即可

背景大图自己设计好 设计好换掉背景大图图片地址即可，这个很简单，说一下也明白我说的是什么了吧

接下拉就是加链接，比如第一组跑马灯的图片要加链接就点击那组图片然后就可以看到链接地址框，把#号删除，加入你要加的链接，一般是加宝贝链接比较多，进入对应宝贝页浏览器上方复制对应地址粘贴过来即可

要添加多组也是一样的操作方法，左边点击添加一张，把对应的图片地址换成你自己的图片地址，同时加链接方法也一样，#号删除加上链接即可，如果觉得对不太齐可以勾方向键微调，按键盘上方向键可以微移位置！

切换速度这些都可以自己调，调完预览看看效果是不是你要的，如果图片是全屏的那就是要勾加入全屏代码选项，不是就不用，间隙按默认调的，装修店铺有间隙再去调整数值 重新生成代码  

生成代码进入装修后台，把代码装到对应模块里即可，C店智能版专业版装950宽自定义区 天猫店智能版或天猫版装990自定义区 C店基础版装右边750自定义内容区。需要布局管理先添加好布局再添加自定义 

加好对应自定义内容区之后，切换源代码模式粘贴代码，粘贴完直接点确定，不要再做其他操作了，预览看效果，没有问题发布即可！这样一个带跑马灯的海报就安装完成了。是不是非常的简单呢！