<div id="container">? ? <div id="list" style="left:-730px;">? ? ? ? <img src="images/5.jpg" />? ? ? ? ? ? <img src="images/1.jpg" />? ? ? ? ? ? <img src="images/2.jpg" />? ? ? ? ? <img src="images/3.jpg" />? ? ? ? ? ? <img src="images/4.jpg" />? ? ? ? ? ? <img src="images/5.jpg" />? ? ? ? ? ? ? ? <img src="images/1.jpg" /> </div>? ? ? ? <div id="botton">? ? ? ? <span class="on"></span>? ? ? ? ? ? <span></span>? ? ? ? ? ? <span></span>? ? ? ? ? ? <span></span>? ? ? ? ? ? <span></span>? ? ? ? </div>? ? ? ? <a href="javascript:;" id="prev" class="arrow"><</a>? ? ? ? <a href="javascript:;" id="next" class="arrow">></a>? </div>? ? <script type="text/javascript"> window.onload = function () {? ? ? ? ? ? var container = document.getElementById('container');? ? ? ? ? ? var list = document.getElementById('list');? ? ? ? ? ? var button = document.getElementById('button').getElementsByTagName('span');? ? ? ? ? ? var prev = document.getElementById('prev');? ? ? ? ? ? var next = document.getElementById('next'); function wrap(offset){ list.style.left = parseInt(list.style.left) + offset + 'px'; } next.onclick = function () { wrap(-730); } prev.onclick = function () { wrap(730); } } </script>