рекурсия в обусловленных прокруткой условных выражениях - PullRequest
0 голосов
/ 06 марта 2019

Когда я использую код ниже, при прокрутке боковая панель мигает взад и вперед. тестирование показало, что это происходит из-за того, что условие winTop >= (contentTop - header.height()) не выполняется при каждой другой итерации прокрутки.

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

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

Вот живой пример: http://www -icoachfirst-com.sandbox.hs-sites.com / test-lptest-lp

JQuery:

var $window = $(window),
    header = $('.header'),
    sidebar = $('#sidebar'),
    content = $('#content'),
    container = $('.floattrap'),
    footer = $('.footer_main');

$(window).on('load scroll resize', function(){
    var contentTop = sidebar.offset().top,
        winTop = $(window).scrollTop(),
      footerTop = footer.offset().top;

console.log(winTop);
    if (winTop >= (contentTop - header.height())) {

    if (footerTop <= (winTop + $window.height())) {
      sidebar.removeClass('stuck');
      sidebar.addClass('bot');
      console.log(true);
    } else {
      sidebar.removeClass('bot');
      sidebar.addClass('stuck');

      $('.stuck').css({
        'top': (header.outerHeight(true) + 20),
        'left': (content.offset().left + content.width()),
        'right': (container.offset().left + container.width())
      });

      console.log(false);

    }
  } else {
    console.log('fail');
    sidebar.removeClass('stuck');
    sidebar.removeClass('bot');
  }
 });

1 Ответ

0 голосов
/ 06 марта 2019

У меня была неправильная переменная. contentTop было установлено в верхнее смещение боковой панели, которую я пытался всплыть, поэтому она сходила с ума. Я хотел установить верхнее смещение блока контента слева для стабильности.

...