今天搞了一天的javascript，准备做一个特效图片轮播，现在晚上十二点，中午十二点我开始搞的，到了现在还没有搞好还差一个鼠标移进移出的暂定和播放，其实这是一个很简单的特效，就是从刚开始的css的布局就高了两个小时，因为没搞过这样的布局，所以觉得很难刚开始都不知道怎么入手，后来在看了视频时候，原来是用的透明度(不在范围内的就是透明度为零)，当布局完事之后就开始搞真正的了......今天五号晚上了，当看了五次视频，五十次调试之后，还是成功，但是现在还有一个问题就是无法再IE；浏览器上兼容，而视频上的那个就能，总的来说就是fliter的问题（在做这个小特效的时候，我总结出来一些内容
1.不能落下任何一个细节
2.从开始就开始测试，不要等到都完成之后在测试这样会有很多bug会没有办法看全
3.代码风格从小细节开始养成。）
图片就是这个图片 大致的布局是这样的
这个盒子的宽是660px，高是330px
然后图片大图列表也是一样的，但是运用了绝得定位让这么多的图片都在这一个盒子里，第一个li下的图片透明度为1，而其余的都是0，一会为了用js显示出来；
而下面的文字列列表是通过display来控制的，定义了一个class是show，带有这个show就是display为block的，其余的就是none，剩下的通过js来控制；
而下面的小图片列表就像图片轮播是一样的，ul下控制一个宽度，ul的其余部分用overflow:hidden来隐藏 li有宽和高，并且都在ul内；
运行到哪个图片的时候，你会观察到有一个亮的边框，这是有个class为active刚开始只有第一个li有，后来就通过js来控制来交替；
还有就是那个左右按钮是通过上一个我的博客background-position来控制的，其实那两个按钮是一张图片；
以上就是css的布局。
下面说一下js部分
刚开始先每点击下面的小图片的时候，就让active这个属性给谁，当然还要有一个for循环当当前的亮的时候，先让其他的暗掉，并且没有上面的小三角；
控制文字列表是和上面一样的，但是有一点要注意这个是h2下面的文字，如果在刚开始没有声明，在for循环声明一个也是一样的；
控制大图因为是一样的，三个不一样的是控制的属性不同；
然后下一步就是控制左右两个按钮
说这个按钮就有必要说一下HTML框架了
<a href="##" id="Btn_pre" class="btn" ></a>
<a href="##" id="Btn_next" class="btn showBtn" ></a>
两个a标签有共同的btn这个class，还各自有各自的ID 比如在最开始的时候向左走是走不了的，所以想做的按键就是暗的，这个通过showBtn这个标签这个标签也是通过透明度控制的；
向左走时利用js使得这个ul走向左走每次走都走得是li的单位，这个样定义一个iNowLeft++然后和每个li宽度的负值相乘然后加上px就是做移的一个单位；
向右走一样，这两个有一个判断值向左走的时候iNowLeft<=0就需要return掉向右走如果iNow>=所有的li前去能显示的li的时候就return掉；
然后就是自动播放了，设置一个定时器，在定义一个iNow，并且iNow每次都要加加，当加到头的时候返回第一个，
当iNow>iNowLeft+6的时候也就是说等于点击按钮的时候也开始动，然后还有iNow <= iNowLeft 这个把iNowLeft改为iNow
基本上就是这样；
下面是我写的代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transi
最低0.47元/天 解锁文章
402
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
