1. Переход (фильтр)
В качестве основного поддерживаемого компонента на него несколько раз упоминаются другие компоненты. Реализовать возможность поддержать переход в соответствии с браузером, а затем связывать конечное событие анимации;
Первое: создать элемент;
Затем: обзор имени переходной анимации, поддерживаемого этим элементом
Навык реализации перехода в основном для переписывания объекта события jQuery, а код заключается в следующем:
$ (function () {$ .support.transition = transitionEnd () if (! $. support.transition) return $ .event.special.bstransitionend = {bindtype: $ .support.transition.end, delegatetype: $ .support.transition.end, grable: function (e) {if ($. e.handleobj.handler.apply (это, аргументы)}}})2. Affix (автоматическое плавающее положение)
1. Цель: Параметр указывает его эталонный узел позиционирования (это должен быть родительский объект контейнера, который генерирует полосу прокрутки), а по умолчанию - окно
2. Верхние и нижние значения, установленные с помощью данных, будут использоваться только для расчета выражений и не будут установлены в CSS.
3. Три типа стилей позиционирования:
3.1. Affix-top: стиль, который будет добавлен при достижении вершины страницы
3.2. Аффикс: стили, которые будут добавлены в середине страницы
3.3. Affix-Bottom: стили, которые будут добавлены в нижней части страницы
4. Обработка формулы:
4.1. Вверху: высота прокрутки трагеты (Scrolltop) <расстояние от верхней позиции элемента (OffsetTop) (первое суждение)
4.1.1. Scrolltop установлен на: верхнюю часть, расположенную самим элементом (расстояние от исходной точки элемента в настоящее время расположено из документа) (не первый раз)
4.2. GetPinnedOffset: Получите верхнюю часть, которая придерживает верхнюю целевую прокрутку элемента
4.3. Внизу: если элемент прилипания в первый раз, когда нижняя часть находится, то внизу - целевая высота прокрутки + Высота целевого элемента> = высота всей высоты прокрутки документа, прилипающей к элементу с нижней части
4.3.1. Если это не первый раз, внизу позиционирование
1) Если OffSetTop (расстояние от верхней позиции элемента) не является пустым, верхняя часть цели + значение getPinnedOffset> Значение липкого элемента, расположенного в настоящее время вверх
2) Если OffSetTop пуст, верхняя часть цели + высота целевого элемента> Высота высоты высоты документа внизу подходит к нижней части
4. Единственный верх, который может изменить элемент прилипания: высота документа - высота элемента прилипания - высота элемента прилипания снизу
5. Где лежит яма:
1) Когда верхняя и дно используются вместе, возникнут конфликты, причины:
Affix-Bothtom, то есть при достижении нижней части страницы Bootstrap использует смещение, чтобы установить верхнее значение и добавляет позицию: относительное значение к элементу, что не приводит к тому, что при снова прокручиваясь вниз после возвращения в верхнюю часть страницы.
Причина: относительный набор встроенных стилей переопределяет фиксированные стили, установленные в классе
6. Резюме
1) Это хорошо в верхней ситуации, и вам нужно добавить ручной контроль внизу в нижней ситуации
2) При применении управления аффиксом, по крайней мере, переписывайте стиль аффикса самостоятельно, чтобы контролировать позиционирование липкой полосы.
Если вы все еще хотите учиться глубже, вы можете нажать здесь, чтобы изучить и прикрепить к вам замечательную тему: учебник по обучению Bootstrap
Эта серия учебных пособий была составлена в: Bootstrap Basic Lutorials Специальные темы, добро пожаловать, чтобы щелкнуть, чтобы учиться.
Выше приведено в этой статье, я надеюсь, что для всех будет полезно изучить программирование JavaScript.