Колесо мыши jQuery с календарем

Я знаю, что было несколько вопросов относительно колесика мыши и прокрутки; Я не уверен, применимы ли какие-либо из них к моей конкретной проблеме. Если да, то прошу прощения за этот вопрос.

Тем не менее, я использую jQuery с FullCalendar. В частности, я ввел небольшую функцию, чтобы календарь прыгал вперед или назад при прокрутке мыши. Он отлично работает с типичным колесиком прокрутки старой школы. Однако при использовании Apple Magic Mouse она слишком сильно прокручивается! Текущий код, который я использую:

 $('#my_calendar')
    .bind('mousewheel', function(event, delta) {
    var view = $('#monthCalendar').fullCalendar('getView');

    if (view.name == "month") {
                if (delta > 0) { $(this).fullCalendar('prev'); }
                if (delta < 0) { $(this).fullCalendar('next'); }
                return false;
    }
 });

Как я могу исправить это, чтобы, если пользователь использует Magic Mouse (или аналогичную), это могло ограничить количество месяцев, прокручиваемых вперед или назад?

Любая помощь будет здорово! Спасибо.


person Dodinas    schedule 22.01.2012    source источник


Ответы (1)


Пробовали ли вы функцию "debounce"? Это немного отличается от структуры подчеркивания:

function debounce(func, wait) {
    var timeout;
    return function() {
      var context = this, args = arguments;
      var later = function() {
        timeout = null;
        func.apply(context, args);
      };
      clearTimeout(timeout);
      timeout = setTimeout(later, wait);
    };
  };

Ваш результирующий код будет выглядеть так:

 function debounce(func, wait) {
      var timeout;
      return function () {
          var context = this, args = arguments;
          var later = function () {
              timeout = null;
              func.apply(context, args);
          };
          clearTimeout(timeout);
          timeout = setTimeout(later, wait);
      };
  };

  var scrolldb = debounce(handleScroll, 200);

  $('#my_calendar').bind('mousewheel', scrolldb);

  function handleScroll(event, delta) {
      var view = $('#monthCalendar').fullCalendar('getView');

      if (view.name == "month") {
          if (delta > 0) {
              $(this).fullCalendar('prev');
          }
          if (delta < 0) {
              $(this).fullCalendar('next');
          }
          return false;
      }
  }

Оптимизируйте параметр «ожидание», пока он не будет работать гладко с Magic Mouse. Я проверил это с помощью панели прокрутки и Magic Mouse.

person Brent Anderson    schedule 22.01.2012
comment
Вау, отлично работает. Я никогда не пользовался функцией 'debounce'. Большое спасибо! - person Dodinas; 22.01.2012