好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

CSS3实现简单轮播图

用css3动画实现图片切换效果,原理还是改变left值。只有最简单的自动播放功能,切换后短时间静止,通过最后的位置克隆第一张图片,实现无缝切换。

html结构

   div   id  ="container"  > 
           ul   class  ="pic"  > 
               li  >  a   href  ="javascript:;"  >  img   src  ="images/DSC01627.jpg"   alt  ="pic1"  >  a  >  li  > 
               li  >  a   href  ="javascript:;"  >  img   src  ="images/DSC01628.jpg"   alt  ="pic2"  >  a  >  li  > 
               li  >  a   href  ="javascript:;"  >  img   src  ="images/DSC02637.jpg"   alt  ="pic3"  >  a  >  li  > 
               li  >  a   href  ="javascript:;"  >  img   src  ="images/DSC01627.jpg"   alt  ="pic1"  >  a  >  li  >     克隆第一张   --> 
           ul  > 
        
       div  >  

查看更多关于CSS3实现简单轮播图的详细内容...

  阅读:35次