Абонирование бутстрапа Twitter с infinitescroll и window.resize

Из чтения нескольких связанных вопросов по этому вопросу я понимаю, что вообще нет метода $.affix('refresh') для компонента аффикса бутстрапа twitter - моя проблема, хотя и связанная, может быть еще одним шагом между просто обновлением, позвольте мне попробуйте объяснить.

У меня есть страница со стандартным навигационным навигатором. ниже которого я буду прикреплять суб-навигатор, который "выталкивает", как только пользователь прокручивается мимо x-пикселей (в моем случае navbar имеет высоту 41px, поэтому при 41px аффикс срабатывает и изменяет класс .affix на .affix {top:41px} все хорошо)

Итак, для этого первого аффикса я могу использовать только атрибуты html.

Далее по странице (по существу, можно считать "вторую страницу" ). У меня есть еще одна часть навигации, которая должна "прикрепляться" и заменять первый суб-навигатор, когда пользователь прокручивается до определенной позиции, - учитывая, что местоположение второй страницы/аффикса является переменной из-за содержимого, которое я использую js для вычисления высоты первой страницы и установки offset: {top:xxx} на основе того, что я получаю.

Это также отлично работает/как и ожидалось, когда пользователь немного прокручивается, первый суб-навигационный аффикс срабатывает, если он продолжает прокручивать и достигает второго суб-навигатора дальше по странице, на которой он запускает и заменяет первое аффикс 'ed sub-nav (он фактически не заменяет его как таковой, а скорее накладывается с более высоким z-индексом)

Отныне у меня есть две проблемы, которые я не смог найти для решения:

когда пользователь изменяет размеры окна, содержимое первой страницы становится более продолжительным, что меняет мои исходные размеры смещения для аффикса вниз по странице. Сначала я подумал, что простой вызов .affix('refresh') будет/может быть решением, но, конечно, этот метод даже не доступен для компонента. Затем я подумал, что могу просто вручную снова рассчитать высоту и заново создать $('.my-second-affix').affix({offset: {top:x-new-offset}}); - НО по какой-то причине это, похоже, не работает вообще, и я не могу понять, почему: (
следующая проблема для решения этой проблемы заключается в том, что я также использую jquery infinitescroll для загрузки все большего количества страниц... каждая страница может иметь другую суб-навигацию на разных этапах, которые я хотел бы наложить и заменить который когда-либо был последним аффиксом, находится наверху.

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

Надеюсь, этого объяснения достаточно, чтобы подчеркнуть мою проблему, и кто-то либо рассмотрел это раньше, либо может предложить некоторые рекомендации по решению. Я попытался получить смещение как функцию, которая возвращает текущее смещение сверху. (Как упоминалось в другом вопросе щелкать по бутстрапу с изменением аффикса), но для некоторых причина, которая также не работает должным образом.

Любая помощь приветствуется

Ответ 1

Вы пробовали $('#myAffix').affix('checkPosition'). Это доступно в Bootstrap3.0

Ответ 2

Этот вопрос довольно старый, но поскольку никто не ответил на него...

У меня была аналогичная проблема с аффикс. Вот как я это решил.

$('.affixed-elements').each(function() {
   var topOffset = 0; //calculate your top offset here
   var $container = //Set this to the element container;
   $(this).affix({
      offset: {
         top: function() {
            return $container.offset().top - topOffset;
         },
         bottom: function() {
            return $('body').height() - ($container.offset().top+$container.outerHeight());
        }
      }
   });
});

Эти настройки должны содержать прикрепленный элемент в границах его контейнера даже после изменения размера окна.

Ответ 3

Если я правильно понял, вам нужно будет рассчитать смещение при изменении размера. В этом примере используется JQuery Что-то вроде:

$(window).resize(calcOffset);

    function calcOffset() 
         {
            var location = $("myElement").offset();
            var top = location.top;
         }

Ответ 4

Я порекомендую вам использовать смещение в коде как это <div class="col-md-offset-6">. Надеюсь, что это будет полезно