[Nailya]

Добрый день.

Пытаюсь написать скрипт по вращению вентилятора вокруг своей оси: вот ссылка, работает более-менее только в FF: http://test.w-complex.ru/mac/control...rol_panel.html

Задача моя такая, при нажатии на кнопку пуск, вентилятор должен вращаться, при нажатии на стоп - останавливаться.
Но работает, как я уже сказала в FF, и то не стабильно, в осталных браузерах кнопка стоп не срабатывает.

Еще, если два раза нажать на пуск, то вентилятор ускоряет свое движение, а это не нужно. И кнопка стоп в этом случае не срабатывате.

Если у вас какие-н варианты решения этой задачи?

Вот скрипт:

function startRound()
{
    document.getElementById('stop').style.background = '#e8c1c2';
    var el = document.getElementById('vent_img');
    this.Elem = '';
    moveRound(el);
}
function moveRound(el)
    {
        if (this.Elem == '')
        {
            this.Elem = el;
            this.Degree = 0;
            this.intid = setInterval (moveRound, 1);
        }
        else
        {
            if (this.Degree > 100000) {this.Degree = 0}
            this.Degree += 2;
            var txt = 'transform: rotate(' + this.Degree + 'deg); ';          // FireFox
            txt += '-webkit-transform: rotate(' + this.Degree + 'deg); '; // Safari & Chrome
            txt += '-o-transform: rotate(' + this.Degree + 'deg); ';      // Opera
            this.Elem.style.cssText = txt;

        }
        if (document.getElementById('stop').style.background == 'none repeat scroll 0% 0% rgb(237, 28, 36)')
        {
            clearInterval(this.intid);
        }
    }
function stopRound()
{
    document.getElementById('stop').style.background = '#ED1C24';
}

<ul class="ventilator">
                        <li class="start" onclick="startRound();">ПУСК</li>
                        <li class="stop" id="stop" onclick="stopRound()">СТОП</li>
                        <li class="vent"><img src="img/ventilater_small1.png" alt="" id="vent_img"></li>
                    </ul>

.ventilator .start{
    margin-top: 16px;
    padding: 5px 22px;
    border:1px solid #cdcfce;
    background: #bdd9bf;
}
.main  .ventilator .stop{
    margin-top: 16px;
    padding: 5px 22px;
    border:1px solid #cdcfce;
    background: #e8c1c2;
}
.ventilator .start:hover{
    border: 1px solid #59595b;
    background: #28b532;
}
.ventilator .stop:hover{
    border: 1px solid #59595b;
    background: #ED1C24;
}