主要为大家详细介绍了基于Javascr ipt实现焦点图轮播效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

不管是高校的网站还是电商的页面，焦点图的切换和轮播应该是一项不可或缺的应用。今天把焦点图轮播制作的技术要点做下笔记，以供日后查看。  一、结构层（HTML） 　　焦点图的HTML结构很简单，就是一个父容器（id=box），包含三个子容器，分别存放图片（id=pics）、底部按钮（id=dots）、作用切换箭头（class=turn）。加上样式后就是下图二的布局。 二、表示层（CSS） 　　页面的表现和风格总是离不开CSS。为叙述方便，后面采用id选择符名或类选择符名代表各div模块。 1.b