图片滑块其实也与图片轮播一样，无需这么多奇奇怪怪的代码就能够实现，只是布局有点复杂，而且这东西在Bootstrap里面也没有，在网页中，这个组件也越来越少见的，毕竟这个小小的组件太浪费网络资源了，实现的逻辑还比较复杂，如果不要被特别要求，能不做最好不好。
有时候，如果一个如同《【CSS】黑色幽默，兼容IE6的纯原生态的门户网站》（点击打开链接）的简单网页就能够交货，就不要卖弄你的前端技巧了。
虽然这个组件的效率很低，但是还是讲解一下实现的原理，也是完美兼容IE6，同时包你能够随心所欲地放置这个组件。不会像网络那些一大堆复杂的代码，不知道写啥，也不知道怎么修改。
一、基本目标
还是《【JavaScript】原生态兼容IE6的图片轮播》（点击打开链接）那几张从windows自带壁纸拉过来图片，在WINXP原生态的IE6浏览器，实现下面的特效：
一个图片滑块组件，每2秒自动按顺序向右移动一次，里面总共四张图片，每次显示三张。
当然我们还提供两个按钮，用户能够自己移动图片
点击相应的图片自然能够最大化。选取再打开一个窗口来查看。很朴素。
二、基本布局
布局如下：
HTML布局代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""><html xmlns=""><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>picmarquee</title></head><body><div>sssssss</div><div style="float:left;"><button onclick="pic_marquee_move(0)"><</button></div><div id="picMarquee" style="float:left;"><div style="padding-left:10px; float:left; display:block;"><a href="imgs/Ascent.jpg" target="_new"><img src="imgs/Ascent.jpg" width="50px" border="0" /></a></div><div style="padding-left:10px; float:left; display:block;"><a href="imgs/Autumn.jpg" target="_new"><img src="imgs/Autumn.jpg" width="50px" border="0" /></a></div><div style="padding-left:10px; float:left; display:block;"><a href="imgs/Azul.jpg" target="_new"><img src="imgs/Azul.jpg" width="50px" border="0" /></a></div><div style="padding-left:10px; float:left; display:block;"><a href="imgs/Crystal.jpg" target="_new"><img src="imgs/Crystal.jpg" width="50px" border="0" /></a></div><div style="padding-left:10px; float:left; display:block;"><a href="imgs/Ascent.jpg" target="_new"><img src="imgs/Ascent.jpg" width="50px" border="0" /></a></div><div style="padding-left:10px; float:left; display:block;"><a href="imgs/Autumn.jpg" target="_new"><img src="imgs/Autumn.jpg" width="50px" border="0" /></a></div></div><div style="float:left; padding-left:10px;"><button onclick="pic_marquee_move(1)">></button></div><div style="clear:both"></div><div>sssssss</div></body></html>请注意，为何布置了需要展示的四张图片，还需要再重复布置从开头开始的两张图片呢？
见下图，红框代表正在展示的部分，一共四种状况，然后不停地循环，给人一种图片序列像右滑动之感。
如果你每次显示2张图片，则再于正常的图片序列之后，从开头开始重复添加一张的图片即可，同样是四种展示状态，这样刚好形成一个循环。也就是说如果你每次要显示N张图片，你就要在整个图片序列之后再从头开始增加N-1张图片。
或许有人提出为何要使用这种违背常人的思维的方式布置图片呢？就不能如下图，图片序列就放置四张图片，然后每次展示前三张，最后一张展示，利用脚本控制一下这个图片序列数组的元素即可，或者其他类似的方法。反正图片序列数组，能够像《【JavaScript】利用getElementsByTagName与getElementsByName改进原生态兼容IE6标签页》（点击打开链接）一样取到？
这在理论上行得通的，JavaScript里面还有两个方法：unshift()在数组之前添加一个元素与pop()删除数组最后一个元素并且返回这个元素，用来实现这种换位呢！然而，实际上，这个通过getElementsByTagName取到的节点序列数组，不像new array()建立的数组，它像是C语言里面的存放指针的数组一样，你是通过指针操作引用，因此不能交换这个节点序列数组的位置，如下图，看到没有？点一点这个数组，发现仅有两个方法。
不要再以任何人说你，因为你不是为任何人而活，你只为自己而活，
