0

我有这个简单的 JavaScript 代码，应该将 div 放入和 div 输出。它在滑入时工作完美。通过完美工作可以轻松滑动 div。但是，当您单击滑出时，div 就会从浏览器中消失。我不知道为什么，我找不到错误。我的代码在这里

<!DOCTYPE html>
<html>
    <head></head>
    <body>

        <script>

            function slideIt()
            {
                var stopPosition = 50;
                var slidingDiv = "";
                slidingDiv = document.getElementById("d3");
                if (parseInt(slidingDiv.style.left) < stopPosition )
                {
                    slidingDiv.style.left = parseInt(slidingDiv.style.left) + 2 + "px";
                    setTimeout(slideIt, 1);
                }
            }

            function slideOut()
            {
                var startPosition =-150;
                var slidingDiv = "";
                slidingDiv = document.getElementById("d4");
                if (parseInt(slidingDiv.style.left) > startPosition )
                {
                    slidingDiv.style.left = parseInt(slidingDiv.style.left) - 2 + "px";
                    setTimeout(slideOut(), 1);

                }
            }



        </script>
        <div id="d1" onclick="slideIt();">Slide in</div>
        <div id="d2" onclick="slideOut();">Slide out</div>
        <div id="d3" style="position: absolute; left:-150px; top:300px" >horizontally sliding div</div>
        <div id="d4" style="position: absolute; left:150px; top:300px">horizontally sliding div</div>


    </body>
</html>
4

1 回答 1

1

您不需要slideOut在第二次超时中调用。删除括号。

setTimeout(slideOut, 1);

这是一个演示：http: //jsfiddle.net/cctqf/

于 2012-12-08T14:15:56.140 回答