用css3动画实现图片切换效果,原理还是改变left值。只有最简单的自动播放功能,切换后短时间静止,通过最后的位置克隆第一张图片,实现无缝切换。html结构<div id="container"> <ul class="pic ...
用css3动画实现图片切换效果,原理还是改变left值。只有最简单的自动播放功能,切换后短时间静止,通过最后的位置克隆第一张图片,实现无缝切换。
html结构
<div id="container"> <ul class="pic"> <li><a href="javascript:;"><img src='/images/loading.gif' data-original="images/DSC01627.jpg" ></a></li> <li><a href="javascript:;"><img src='/images/loading.gif' data-original="images/DSC01628.jpg" ></a></li> <li><a href="javascript:;"><img src='/images/loading.gif' data-original="images/DSC02637.jpg" ></a></li> <li><a href="javascript:;"><img src='/images/loading.gif' data-original="images/DSC01627.jpg" ></a></li><!-- 克隆第一张 --> </ul> </div>
原标题:CSS3 实现简单轮播图
关键词:CSS
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。