如图所示，底下的小图在自动轮播的时候不动，只是在1秒后篮框出现到下个小图上，等到蓝框出现到最右侧的小图时，下一秒底下的小图向左移动4个小图的位置，这样的自动轮播图该怎么做，求大神给个思路
这是轮播图代码部分
<p class="img_list_area">
<p class="top_img">
<span class="T_next"></span>
<span class="T_prev"></span>
<ul>
<li>
<a>
<img src="img/img_list.png"/>
</a>
</li>
<li>
<a>
<img/>
</a>
</li>
<li>
<a>
<img/>
</a>
</li>
<li>
<a>
<img/>
</a>
</li>
<br clear="all"/>
</ul>
</p>
<p class="bottom_img">
<span class="B_next"></span>
<span class="B_prev"></span>
<ul>
<li class="on">
<a>
<img src="img/img_list.png"/>
</a>
<p class="blue_border"></p>
</li>
<li>
<a>
<img src="img/img_list.png"/>
</a>
<p class="blue_border"></p>
</li>
<li>
<a>
<img src="img/img_list.png"/>
</a>
<p class="blue_border"></p>
</li>
<li>
<a>
<img src="img/img_list.png"/>
</a>
<p class="blue_border"></p>
</li>
<br clear="all"/>
</ul>
</p>
</p>
