【JS/CSS3】实现带预览图幻灯片效果~

适用场景：单例布局
1.2 方法论

V视图 HTML+CSS+调试
C js实现控制流程
D数据 优化扩展

二、代码

结构

<div class="slider"><!-- 特效区 --> <div class="main"><!-- 主视图区 --> <div class="main_i"> <div class="caption"> <h2>h2 caption</h2> <h2>h3 caption</h2> </div> <img src="http://www.likecs.com/images/{{index}}.jpg" alt=""> </div> </div><!-- 主视图区结束 --> <div class="ctrl"><!-- 控制区 --> <a href="javascript:;"><img src="http://www.likecs.com/images/{{index}}.jpg" alt=""> </a> </div><!-- 控制区结束 --> </div><!-- 特效区结束 -->