今天完成的事情：

             1.修改任务十五的HTML结构

             2.修改任务十五第一个页面的导航栏

            3. 修改任务十五第一个页面的轮播图

            4. 完成CSS样式分离

 完成的成果：

导航栏

轮播图

在原有的基础上加上控制器效果来控制轮播图。

明天计划的事情：

               完成任务十五的重构任务。主要的难点已经解决。

遇到的难题：

              在轮播图的制作过程中，一开始没有加上定时器效果所以一下子就做好了，主要依赖于来完成我想要的动画效果。但是如果需要加上控制器效果就需要加上很多东西。

为每一张轮播图配上相应的ID选择器来达到控制效果，

基本思路：

以5张图片为例：

1.基本布局：

将5张图片左浮动横向并排放入一个div容器内，图片设置统一尺寸，div宽度设置5个图片的总尺寸，然后放入相框容器div，相框设置1个图片的大小并设置溢出隐藏，以保证正确显示一个照片。

2.设置动画：

然后使用css3动画，通过对photos进行位移，从而达到显示不同的图片，每次偏移一个图片的宽度，即可显示下一张图片。5张图片，需要切换4次，定义动画0%，20%，40%，80%，100%。

3.动画分解：

为了让图片切换后静置一段时间，可以将动画细分为：位移切换和静置两个阶段。

即20%~40%里面包含切换到第二张图片并且将第二张图片静置。

另外，根据需要可以对各个图片添加相应的序号和图片简介。

这张代码的含义就是轮播图的主要精髓

遇到的最大问题就是轮播图为了达到效果添加了定位，但是定位效果使得轮播图脱离了文档流，在轮播图脱离文档流的情况下，我的布局因为中间部分脱离文档流，所以造成布局崩塌。但是取消定位效果，由于轮播图都是在一个DIV里面，取消定位之后就造成了：

轮播图DIV超出文本流。

收获：

   重构任务中，完成了对基础代码的熟练和理解，对轮播图的动画效果有了更深的理解。