плагин localscroll jQuery - проблема с анимацией - PullRequest
0 голосов
/ 02 июня 2011

Я использую популярный плагин jQuery scrollTo / localScroll для создания одностраничной навигационной системы, которая автоматически прокручивает окно к различным тегам привязки.У меня это работает без проблем, но я не могу предотвратить анимацию в очереди.

У меня есть неупорядоченный список с идентификатором 'main_nav', который я использую для перехода к опорным точкам:

<ul id="main_nav"> 
  <li><a href="#one">One<a> </li> 
  <li><a href="#two">Two</a></li> 
  <li><a href="#three">Three</a> </li> 
  <li><a href="#four">Four</a> </li> 
</ul>

При вызове функции есть параметр с именем 'stop'который должен очищать любые анимации, находящиеся в очереди в данный момент, с помощью функции jquery stop ().Параметр по умолчанию имеет значение true в плагине, но я все равно его указал.Плагин также по умолчанию ссылается на окно в качестве цели для прокрутки.Я вызываю функцию следующим образом:

$(document).ready(function() {
  $('#main_nav').localScroll({
    duration:2000,
    stop:true
  });
});

Это работает, но параметр 'stop' игнорируется ... если я нажму все четыре ссылки в быстрой последовательности, страница перейдет к каждой ссылке одна за другойдругой, на это уходит всего 8 секунд.Не идеально!Если я заверну всю страницу в контейнер div, задаю ей высоту и задаю переполнение: scroll;и затем нацелить этот div с помощью функции localScroll, тогда работает параметр stop.например, при таком вызове анимация больше не стоит в очереди:

$(document).ready(function() {
  $('#main_nav').localScroll({
    target: $('#container'),
    duration:2000,
    stop:true
  });
});

Кажется, что когда плагин ссылается на div в качестве цели для прокрутки, он может выполнить функцию jquery stop (),но когда для цели установлено значение «окно», функция остановки не работает.

Я попытался создать оболочку jQuery для объекта окна и сослаться на нее как на цель следующим образом:

$(document).ready(function() {
  $('#main_nav').localScroll({
    target: $('window'),
    duration:2000,
    stop:true
  });
});

... но это тоже не работает.В самом плагине значения по умолчанию:

$localScroll.defaults = {
  duration:1000, // How long to animate.
  axis:'y', // Which of top and left should be modified.
  event:'click', // On which event to react.
  stop:true, // Avoid queuing animations 
  target: window, // What to scroll (selector or element). The whole window by default.
  reset: true // Used by $.localScroll.hash. If true, elements' scroll is resetted before actual scrolling
};

У кого-нибудь есть идеи, как остановить анимацию?

Я использую: jQuery 1.6.1, scrollTo 1.4.2, localScroll 1.2.7

Ответы [ 2 ]

0 голосов
/ 15 августа 2011

Я НАШЕЛ ЭТО!

Я не знаю, почему окно объекта байт не может быть анимировано В консоли:

$(window).animate({ scrollTop: 110}, 1000);
TypeError
$('body').animate({ scrollTop: 110}, 1000);
[
<body>​…​</body>​

Чтобы решить проблему, просто измените цель на тело

target: $('body')

и вот оно:)

0 голосов
/ 15 августа 2011

Я попробовал

  $('.menu, .up, #send, #ok').localScroll({
    duration: 1800,
    stop: true,
    hash: true,
    onBefore: function(e, elem, $target) { // this = settings
      $target.stop();
    }
  });

но это тоже не работает

.. тогда я подумал, что это может быть проблема с версией jQuery (scrollTo и остальные с 2009 года), поэтому я вернулся к jquery 1.2.6 и до сих пор ничего, поэтому я думаю, что это может быть проблема с плагином scrollTo

теперь я попытаюсь написать собственный плагин scrollTo, используя только .animate()

...