Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > JavaScript: Общие вопросы > Объекты и рекурсия в JS

Автор: LordZeus 2.6.2009, 13:03

Здравствуйте!
Не знаю на сколько сложна данная проблема, но пока решил разместить в разделе для новичков...

Суть такая есть задача: при наведении на DIV - запускается JS, который двигает и делает все более и более прозрачным картинку...как только картинка достигает правого конца div'а она начинает постепенно появляться и снова движется к своему месту.

при выводе мышки из поля div - срабатывало прерывание setTimeoute, и запускался обратный прохода . Как только он достигал начала дива - он останавливался...

Проблема возникла тогда, когда и стал наводить и выводить и наводить на этот же див...и на другие(похожие дивы)...(у меня меню на сайте реализовано с помощью Div)...и тут-то началось самое странное... все они стали двигаться одновременно на всех меню...а когда наводишь на одно и то-же меню несколько раз подряд...то возникает дополнительное изображение, которое движется на встречу завершающему изображению...

соответственно я подумал о том, что нужно создавать объект каждый раз, когда происходит наведение на менюшку и в самом объекте прописать уже сценарий прорисовки... но я ни как не могу понять как работает в объекте рекурсия, прерывания и т.д.

Код


var mmm = 0, mmm1=0, ii=0;

function Move(id1, show_hide1) 
  {
    this.id=id1;
    this.show_hide=show_hide1;
    
    this.go=function (ii)
       {
          
          ii++;
          alert(ii);
          if(ii<=34)
            {
            
              clearTimeout(mmm1);
              
              document.getElementById(this.id).style.opacity= 1-(ii*2.9/100);
              document.getElementById(this.id).style.left= ii*4;
              mmm = setTimeout("alert('qwe!')",40);
            }
        }
    this.go_back = function (ii)
        {
        
         ii--;
          if(ii>=0)
           {
           
             document.getElementById(this.id).style.opacity= 1-(ii*2.9/100);
             document.getElementById(this.id).style.left= ii*4;
             mmm1 = setTimeout(function() { this.go_back(ii) },40);
           }
        }
  }
//Move.go = 

 
function change_menu( id, show_hide ) 
{  
  var move= new Move(id, show_hide);

  if(show_hide == 1)
    {
      move.go(ii);
    }
  else
    {
      move.go_back(ii);
    }

}

в общем я предполагал, что это будет работать так:
при наведении и выведении курсора из меню происходит вызов функции change_menu где id -id менюхи, а show_hide - выведение или наведение курсора на меню

далее создаем объект move класса Move, в котором заранее прописаны 2-а метода: go и go_back. Если мы наводим - то запускается go... если выводим - запускается go_back... но мне никак не удается заставить это работать... я предполагаю что проблема в рекурсивном обращении ...

если у кого - нибуди есть мысли о том, что я делаю не так...очень прошу поделиться с начинающим программером на JS

Заранее спасибо =0)

Автор: vasac 2.6.2009, 19:05

это не раздел для новичков )
так прерывания всё-таки или рекурсия? smile

Автор: Aliance 3.6.2009, 10:47

В JS есть аналог pascal`евской goto, называемый меткой:

Код


my_label:
    //code goes here

if ( true )
    break my_label; // прерываем метку
else
    continue my_label; // переходим к метке

Автор: SelenIT 5.6.2009, 01:54

А не лучше ли завести один общий setInterval, по которому обегать массив анимируемых объектов и обновлять их состояние? С учетом флагов, выставляемых/сбрасываемых по событиям мышки...

Автор: TetraHC 8.6.2009, 22:22

Я не проверял, но уверен на 100%, что у тебя ошибка и ты переходишь в бесконечный цикл

Автор: Trunk 1.7.2009, 15:03

>>document.getElementById(this.id).style.opacity= 1-(ii*2.9/100);
В ИЕ работать не будет

А вообще подобного рода эффекты можно реализовать с помощью JQuery или scriptaculous и не заморачиваться