图片的滚动问题，不是连续滚动，点击滚动一张

各位高手，这个问题不知道怎么说，我贴上源码，麻烦存为html看看效果，我要的就是这个效果，不过现在不是兼容所有的浏览器，如果各位哪位有现成的麻烦给我发一份，，谢谢了，以下为源码<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>陈斌_点击图片滚动</title>
    <script language="javascript" type="text/javascript">
        var prox;
        var proy;
        function minusleft() {
            var divcontent = document.getElementById('divcontent');
            var divcontent_2 = document.getElementById('divcontent_2');
            divcontent_2.innerHTML = divcontent.innerHTML;
            divcontent_2.style.position = 'absolute';
            divcontent_2.style.paddingLeft = '15px';
            divcontent_2.style.paddingRight = '15px';
            divcontent_2.style.width = '9910px';
            divcontent_2.style.height = '192px';
            document.getElementById('nice').style.cellspacing = '50';
            var left = divcontent.style.left.replace("px", "");
            // alert(left);
            if (left <= -920) {
                left = 0;
            }
            else {
                var index = 150;                prox = setInterval(function () { minus(left, index, divcontent) }, 10)
            }
        }        //left原始的left,index要减去的长度
        function minus(left, index, obj) {
            var temp = left;
            var divcontent = document.getElementById('divcontent');
            var divcontent_2 = document.getElementById('divcontent_2');
            var currentleft = obj.style.left.replace("px", "");
            if (currentleft <= -920) {
                currentleft = 0;
                obj.style.left = currentleft + "px";
                clearInterval(prox);
                return;
            }
            if (parseInt(temp - currentleft) < index) {                divcontent_2.style.position = 'absolute';
                if (parseInt(currentleft) > 0) {
                    divcontent_2.style.left = (parseInt(currentleft) - 920) + 'px';
                }
                else {
                    divcontent_2.style.left = (parseInt(currentleft) + 920) + 'px';
                }
                currentleft -= 10;
                //  alert(currentleft);
                //   divcontent_2.style.left = (divcontent_2.style.left.replace('px','') - Math.abs(parseInt(currentleft))).toString() + 'px';
                // divcontent_2.style.left = (920 + parseInt(currentleft)).toString() + 'px';
                // divcontent_2.style.left = (Math.abs(currentleft) - 920).toString() + 'px';
                // alert(divcontent_2.style.left);
                obj.style.left = currentleft + "px";
            }
            else {
                clearInterval(prox);
            }
        }        function Plusleft() {
            var divcontent = document.getElementById('divcontent');
            var divcontent_2 = document.getElementById('divcontent_2');
            divcontent_2.innerHTML = divcontent.innerHTML;
            divcontent_2.style.position = 'absolute';
            divcontent_2.style.paddingLeft = '0px';
            divcontent_2.style.paddingRight = '0px';
            divcontent_2.style.width = '9910px';
            divcontent_2.style.height = '192px';
            document.getElementById('nice').style.cellspacing = '50';
            // alert(divcontent_2.style.left);
            var left = divcontent.style.left.replace("px", "");
            divcontent_2.style.left = (parseInt(left) - 920).toString() + 'px';
            if (left >= 920) {
                left = 0;
                clearInterval(proy);
            }
            else {
                // alert(left);
                var index = 150;
                proy = setInterval(function () { plus(left, index, divcontent) }, 10)
                //left = parseInt(left) + 150;
            }
            // alert(right);
            divcontent.style.left = left + "px";
            //  alert(divcontent.style.left);
        }        //left原始的left,index要减去的长度
        function plus(left, index, obj) {
            var divcontent = document.getElementById('divcontent');
            var divcontent_2 = document.getElementById('divcontent_2');
            var temp = left;
            // alert(temp);
            var currentleft = obj.style.left.replace("px", "");
            if (currentleft >= 920) {
                currentleft = 0;
                obj.style.left = currentleft + "px";
                clearInterval(proy);
                return;
            }
            //          alert(index)
            //            alert(currentleft)
            //            alert(temp)
            if (parseInt(currentleft) - parseInt(temp) < parseInt(index)) {
                // alert(currentleft);
                currentleft = parseInt(currentleft) + 10;
                obj.style.left = currentleft + "px";                var divleft = parseInt(divcontent_2.style.left.replace('px', '')) + 10;
                //  alert(divleft);
                divcontent_2.style.position = 'absolute';                if (parseInt(currentleft) > 0) {
                    divcontent_2.style.left = (parseInt(currentleft) - 920) + 'px';
                }
                else {
                    divcontent_2.style.left = (parseInt(currentleft) + 920) + 'px';
                }
                // divcontent_2.style.left = (parseInt(divleft)).toString() + 'px';
                // alert(divcontent_2.style.left);
            }
            else {
                clearInterval(proy);
            }
        }
    </script>
    <style>
        .mainDiv
        {
            width: 600px;
            height: 182px;
            background-color: green;
            position: relative;
            text-align: center;
            overflow: hidden;
        }
        .contentDiv
        {
            position:relative;
            text-align: left;
          
            margin-top: 10px;
            margin-left: 0px;
            width: 580px;
            height: 162px;
           
            overflow: hidden;
           
        }
        .contentdiv2
        {
            position: absolute;
            width: 50910px;
            height: 162px;
            padding-left: 4px;
            padding-right: 4px;
            margin: 0px;
            text-align: left;
        }
    </style>
</head>
<body>
    <div class="mainDiv">
        <div class="contentDiv">
            <div class="contentdiv2" id="divcontent" style="right: 0px; left: 0px; padding-left: 10px;
                padding-right: 10px;">
                <table  cellpadding="0" cellspacing=5 id="nice">
                    <tr>
                        <td>
                            <img src="1.bmp" width="150px" height="150px" />
                        </td>
                        <td>
                            <img src="2.bmp" width="150px" height="150px" />
                        </td>
                        <td>
                            <img src="3.bmp" width="150px" height="150px" />
                        </td>
                        <td>
                            <img src="4.bmp" width="150px" height="150px" />
                        </td>
                        <td>
                            <img src="5.bmp" width="150px" height="150px" />
                        </td>
                        <td>
                            <img src="6.bmp" width="150px" height="150px" />
                        </td>
                    </tr>
                </table>
            </div>
            <div id="divcontent_2" style="right: 0px; left: 0px;">
            </div>
        </div>
    </div>
    <input type="button" value="向左移动" onclick="minusleft()" />
    <input type="button" value="向右移动" onclick="Plusleft()" />
</body>
</html>