Javascript setTimeout-recursion не работает с Chrome и Firefox - PullRequest
Новая
       14

Javascript setTimeout-recursion не работает с Chrome и Firefox

1 голос
/ 28 января 2012

Код ниже предназначен для перемещения div внутри другого скрытого div переполнения (концепция для будущего сайта).Текстовое поле под ссылками «next» и «previous» предназначено для указания значения x.С IE8 все работает просто отлично.

С Chrome и Firefox кажется, что он выполняет функцию только один раз (один шаг) и «следующий», и «предыдущий», что означает setTimeout бежать. 

<html>
    <meta http-equiv="Content-Script-Type" content="text/javascript">
    <head>
        <script type="text/javascript">

            var ie5 = (document.all && document.getElementById);
            var ns6 = (!document.all && document.getElementById);

            function next(startx, fadeStep, end){
                if(startx > end){
                    startx -= Math.round((1/Math.pow(fadeStep,0.6)));
                    if (startx < end) startx = end;
                    document.getElementById('lastname').value = startx + "px";
                    document.getElementById('test1').style.left = startx + "px";
                    fadeStep += 0.00035;
                    args = "next(" + startx + "," + fadeStep + "," + end + ")";
                    setTimeout(args, 20); 
                }
            }

            function prev(startx, fadeStep, end){
                if(startx < end){
                    startx += Math.round((1/Math.pow(fadeStep,0.6)));
                    if (startx > end) startx = end;
                    document.getElementById('lastname').value = startx + "px";
                    document.getElementById('test1').style.left = startx + "px";

                    setTimeout('prev(' + startx + ',' + (fadeStep+0.00035) + ',' + end + ')', 20);
                }
            }

        </script>
    </head>
    <body>
        <div style="position:relative;width:570;height:78;overflow:hidden">
            <div id="test1" style="position:absolute;left:0px;top:0px;width:1180;height:78">
                <img src="http://img38.imageshack.us/img38/7225/imageva.png" border=1>
                <img src="http://img577.imageshack.us/img577/5554/image2te.png" border=1>
            </div>
        </div>
        <div style="position:absolute;left:900px;top:0px;width:800">
            <a href="#" onclick="next(0, 0.001, -570)">Next</a><br />
            <a href="#" onclick="prev(-570, 0.001, 0)">Previous</a></ br>
            <form><input type="text" id="lastname" value="gfgfg"/></form>
        </div>

    </body>
</html>

Можете ли вы помочь?

1 Ответ

1 голос
/ 28 января 2012

В этом случае может быть лучше использовать setTimeout, как показано ниже: 

window.setTimeout(function() { next(startx, fadeStep, end); } , delayInMiliseconds);

Однако отсутствует «окно».префикс объекта может быть еще одной причиной того, что ваша функциональность не работает в этих браузерах.

Если у вас есть какие-либо другие вопросы, не стесняйтесь их задавать.

Как указано в комментариях, это спасет товармного времени, чтобы использовать JQuery.

С уважением,

...