2

Почему-то при выполнении зависает и не перестаёт (а ведь по теории не должен). Как исправить зависание и добиться того, чтобы тело while выполнялось, становилась пауза 1 ms, и так много-много раз, согласно условию while'а?..

Код:

function razvorot(num) {
    var w = 50;
    var w2 = 50;
    var o = 1;
    if (num = 1) {
        while (w < 100) {
            setTimeout(function () {
                w++;
                w2--;
                o -= 0.02;
                document.getElementById('kortush').style.width = w + '%';
                document.getElementById('kandi').style.width = w2 + '%';
                document.getElementById('i2').style.opacity = o;
                console.log('mod1:w = ' + w + '; w2 = ' + w2);
            }, 1)
        }
        document.getElementById('i1').style.width = 'auto';
        document.getElementById('i1').style.height = '80%';
        document.getElementById('i1').style.left = '35%';
        document.getElementById('i1').onmouseover = '';
        document.getElementById('header').style.display = 'none';
    } else {
        while (w < 100) {
            w++;
            w2--;
            document.getElementById('kandi').style.width = w + '%';
            document.getElementById('kortush').style.width = w2 + '%';
            console.log('mod2:w = ' + w + '; w2 = ' + w2);
        }
    }

}
1
  • 2
    офигенное условие: if(num = 1) { да и вообще ваш код меня поражает, почитайте про совмествное использование циклов и setTimeout, узнайте, что такое замыкания и как они работают
    – Spectre
    14 ноя 2012 в 16:47

1 ответ 1

5

Зависает только потому, что у вас идет цикл while, а вы, по всей видимости, хотите добиться анимации. Так знайте, что для этого используют setInterval, а в джквери вообще вдобавок супер-пупер навороты.

Вот как-то так:

   function razvorot(num) {
    var w = 50;
    var w2 = 50;
    var o = 1;
    if (num == 1) {
        var interval = setInterval(function () {
            w++;
            w2--;
            o -= 0.02;
            document.getElementById('kortush').style.width = w + '%';
            document.getElementById('kandi').style.width = w2 + '%';
            document.getElementById('i2').style.opacity = o;
            console.log('mod1:w = ' + w + '; w2 = ' + w2);

            if(w > 100) {
                clearInterval(interval);
            }
        }, 78)
        document.getElementById('i1').style.width = 'auto';
        document.getElementById('i1').style.height = '80%';
        document.getElementById('i1').style.left = '35%';
        document.getElementById('i1').onmouseover = '';
        document.getElementById('header').style.display = 'none';
    } else {
        var interval2 = setInterval(function () {

            w++;
            w2--;
            document.getElementById('kandi').style.width = w + '%';
            document.getElementById('kortush').style.width = w2 + '%';
            console.log('mod2:w = ' + w + '; w2 = ' + w2);

            if(w > 100) {
                clearInterval(interval2);
            }
        }
    }
}

Код мб и не рабочий, но принцип явно видно.

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.