用JavaScript写的轮播小案例

1. 设置一个容器来放置图片，在css中设置其样式。
2. • 标签定义无序列表，支持HTML中的全局属性和事件属性，所有的主流浏览器都支持
     • 标签的使用，也可以在
       • 标签内使用
       • 标签。
       • 标签定义列表项目，可用在有序列表
         1. 和无序列表
         • 中,支持HTML中的全局属性和事件属性，所有的主流浏览器都支持
         • 标签的使用。
         • 在调用标签使用时必须提供href和name属性。
         • 设置字符实体，在图片滚动轮播的时候调用起来，<和>分别代表的是小于号和大于号。
         • 在HTML页面的部分引入js文件，在js文件中书写图片的有动画效果的轮播和无动画效果的轮播。
         • 先声明三个变量，分别是全局变量(记录图片当前位置)，false(记录当前动画状态)和autoTimer(计算器变量)，需要使用时在wondow.onload页面加载事件中调用。
         • 在window.onload页面加载事件中，先获取向右按钮和放置图片的容器的id，获取元素，然后绑定点击事件，用if……else……判断语句，如果transfor==true则返回，判断是否到了第一张图片附属图的位置，向右点击图片滚动时，每张图片间隔的距离是-500。

1. 在window.onload页面加载事件中，先获取向左按钮和放置图片的容器的id，获取元素，然后绑定点击事件，用if……else……判断语句，如果transfor==true则返回，判断是否到了第五张附属图的位置，向左点击图片滚动时，每张图片间隔的距离是500。
2. 获取圆形按钮的id值和li标签来，用for循环来遍历所有的圆形按钮，绑定点击事件，var声明一个变量，i=0，i的长度小于aCircleBtn的长度，i自增如果transfor==true则返回。声明一个变量myIndex去获取元素的属性，当前位置等于总位置长度-初始位置。

11.先声明一个自动播放的函数，然后调用，获取到id，每隔2秒去调用一下自动播放的函数，图片间隔2秒循环滚动播放动画，获取元素，鼠标移入，自动播放停止，停止无限循环，鼠标移出，自动播放停止。

 12.传入一个变量，获取元素，分别判断是否到了第一张和第五张图片附属图的位置，设置圆形按钮高亮效果的切换，获取元素遍历所有的圆形按钮，根据图片的位置，设置对应的按钮高亮。

 13.动画切换函数：传入变量，获取元素，声明图片滚动完一圈需要的运动总时间，每一次小运动的间隔时间和位移量，计算目标值。

14.调用运动函数，运用if……else……判断语句，当speed>0;目标值始终大于运动过程中的left值；当speed<0;目标值始终小于运动过程中的left值；&&和||这两个符号的意思分别是并且和或者，就递归调用函数，分别判断是否到了第一张和第五张附属图的位置。