Цепочка jquery в наложении div

Я пытаюсь «связать» (добавить) и дополнительную функцию к этому:

Исходный код, он активирует плагин ScrollTo:

$('a.scroll').live('click',function(){   
   $.scrollTo(this.hash+"_", 3333, {easing:'easeOutCubic'} ); 
   window.location.hash = this.hash;
   return false;
});

Что я хочу, так это то, что пока страница плавно прокручивается, ТАКЖЕ иметь оверлей div fadeIn, оставаться на экране в течение пары секунд, а затем постепенно исчезать и удаляться непосредственно перед окончанием плавной прокрутки.

Я уже использую этот оверлей div под названием #preloader при обычной загрузке страницы, но я хотел бы также использовать его во время действия scrollTo. (Это фиксированный оверлейный div с анимацией «загрузки» css3 внутри него.)

Вот пример того, что я пробовал до сих пор, чтобы попытаться "связать" это в:

$('a.scroll').live('click',function(){   
    $.scrollTo(this.hash+"_", 3333, {easing:'easeOutCubic'} ); 
        $('#preloader').fadeIn(1234,function(){  // overlay div
            $(this).delay(1234).remove(); 
        });
    window.location.hash = this.hash;
    return false;
});

При этом ничего не происходит. ScrollTo по-прежнему работает, но оверлей не появляется.

Как правильно связать это? Он должен постепенно появляться, а затем, после установленной задержки, исчезать. Спасибо за вашу помощь, я довольно бесполезен с jquery.


jquery chaining
person user1691389    schedule 19.10.2012    source источник
comment
есть ли какая-либо важная причина для отказа от читабельности в вашем коде?   -  person Caspar Kleijne    schedule 19.10.2012
comment
не понимаю вопроса..   -  person user1691389    schedule 19.10.2012

Ответы (1)


arrow_upward
0
arrow_downward

Я не мог заставить его работать, поэтому в итоге я использовал другой эффект:

$('a.scroll').live('click',function(){  
    $('body').fadeTo('slow', 0.3);
    $.scrollTo(this.hash+"_", 3333, {easing:'easeInOutExpo'}); 
    window.location.hash = this.hash;
    $('body').fadeTo('slow', 1.0);
    return false;
});

ScrollTo кажется намного более плавным (менее нервным или негладким), используя это. Перед плавной прокруткой непрозрачность тела уменьшается до 0,3, а затем, когда анимация scrollTo завершена, содержимое страницы возвращается к обычной непрозрачности 1,0.

Это не то, что я изначально хотел, но это создает иллюзию большей плавности при использовании scrollTo.

person user1691389    schedule 19.10.2012