Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Проблема в интеграции эффекта в имеющийся скрипт (https://javascript.ru/forum/events/23604-problema-v-integracii-ehffekta-v-imeyushhijjsya-skript.html)

ADS 29.11.2011 20:18

Проблема в интеграции эффекта в имеющийся скрипт
 
Добрый день! Уважаемые яваскриптеры!
Не смотря на то, что активно изучаю сей язык, пока недостаточно знании и опыта. Вот и застопорился в прикрутке одного эффекта.
В общем, есть скрипт скроллинга (горизонтального, вертикального, диагонального), работающего c jQuery UI - сам по себе скрипт работает отлично. Ниже его код:
spScrollToHash = { 
    scroll: function(id,speed,typ){
      if(id=='' || id=='#' || $(id).length==0) return false;
      if(speed==undefined || speed<1 || speed>1000) speed = 1000;
      if(typ==undefined || typ<1 || typ>3) typ = 3;
      var par = 'html'
      if($.browser.safari) par = 'body';
      var offset = $(id).offset();
      spScrollToHash.stop();
      switch(typ){
        case 1:
          $(par).animate({scrollTop:offset.top,scrollLeft:offset.left},speed,function(){document.location.hash=id;});
          break;
        case 2:
          $(par).animate({scrollTop:offset.top},Math.round(speed/2),function(){
            $(par).animate({scrollLeft:offset.left},Math.round(speed/2),function(){document.location.hash=id;});
          });
          break;
        case 3:
          $(par).animate({scrollLeft:offset.left},Math.round(speed/2),function(){
            $(par).animate({scrollTop:offset.top},Math.round(speed/2),function(){document.location.hash=id;});
          });
          break;
      }
      return false;
    },

    stop: function(){
      $('a[href*="#"]').stop();
    },

    ready: function(speed,typ){
      var id = document.location.hash;
      spScrollToHash.scroll(id,speed,typ);
      $('a[href*="#"]').click(function(){
        id = $(this).attr('href');
        id = id.substr(id.indexOf('#'));
        spScrollToHash.scroll(id,speed,typ);
        return false;
      }); 
    }
  }

  $(function(){ 
    spScrollToHash.ready(1000,3);
  });

Собственно, при клике по якорной ссылке происходит плавное перемещение в нужном направлении по телу страницы к тегу с соответствующим id.

Мне необходимо, чтобы после клика, до момента перемещения происходило действие:
$("div#test_1").hide("slide", { direction: "up" }, 500);
$("div#test_2").hide("slide", { direction: "down" }, 500);

т.е. один блок уезжает наверх, второй вниз и только после этого происходит скроллинг.
Далее, после завершения скроллинга необходимо вернуть те два блока в исходное положение выполнив действие:
$("div#test_1").show("slide", { direction: "up" }, 500);
$("div#test_2").show("slide", { direction: "down" }, 500);

Получается: обработка клика и hide - scroll - show. Пока что у меня получалось только одновременное выполнение и слайда и скроллинга. Не знаю в каком направлении пытаться, то ли задержку действи производить, то ли как.

Возможно, кто-то сможет помочь?
Спасибо.

ADS 30.11.2011 23:39

Решение вопроса
 
нужный участок в нужном виде:
$("div#test_1").hide(500);
		$("div#test_2").hide(500, function(){ 
            spScrollToHash.scroll(id,speed,typ,function(){
                $("div#test_1").show(500);
                $("div#test_2").show(500);
            }); 
        });


Спасибо neoksу за оказанную помощь!


Часовой пояс GMT +3, время: 23:42.