Question

我有一个包含几张图片的div，使用javascript我在该div中向左和向右滚动，我的问题是由于某些原因在firefox中的值与chrome中的值不同（工作正常）：

function scroll_right()
    {
        document.getElementById('left').style.opacity='1';
        document.getElementById('left').style.filter='alpha(opacity=100)';
        document.getElementById('scroller').scrollLeft+=PixelPerInterval;
        if(!stop)
        t = setTimeout("scroll_right()",10);
        else
        stop = false;
        scrX = document.getElementById('scroller').scrollLeft;
        pwidth=document.getElementById('cont').clientWidth;
        awidth=document.getElementById('cont').scrollWidth;
        //document.getElementById('type').innerHTML = scrX + ' ' + (awidth-pwidth);
        if ((scrX) >= (awidth-pwidth))
        {
            //type.innerHTML = scrX + ' right';
            document.getElementById('right').style.opacity='0.4';
            document.getElementById('right').style.filter='alpha(opacity=40)';
        }
    }

使用scroll_left很简单，只需要scrX = 0。外部容器称为scroller，其宽度是固定的，内部容器称为cont，其宽度不是由用户设置的，因此可以输入无限的图片。

有什么想法吗？（不使用jquery）。

非常感谢。

btw html代码：

            <img src="left.png" id="left" onmouseover="scroll_left();" onmouseout="stop_scroll();"/>
            <div id="scroller">
                <div id="cont">
                    <a onclick="main(this);" href="#"><img class="thumb" id="persp" src="sport/911-persp.png" alt="persp"/></a>
                    <a onclick="main(this);" href="#"><img class="thumb" id="side" src="sport/911-side.png" alt="side"/></a>
                    <a onclick="main(this);" href="#"><img class="thumb" id="front" src="sport/911-front.png" alt="front"/></a>
                </div>
            </div>
            <img src="right.png" id="right" onmouseover="scroll_right();" onmouseout="stop_scroll();"/>

Javascript - 滚动到页面末尾时找到 - firefox

0 个答案: