PipUI v1.6.0
  • 🌟Введиние
  • 🗃️Скачать
  • ⚠️Начало работы
  • Компоненты
    • Базовый набор
    • Отступы
    • Палитра цветов
    • Grid сетка
    • Панель навигации
    • Выпадающее меню
    • Постраничная навигация
    • Формы
    • Кнопки
    • Полосы прогресса
    • Меню навигации
    • Модальные окна
    • Оповещения
    • Подтверждения действий
    • Вкладки
    • Хлебные крошки
    • Спойлеры
    • Таблицы
    • Панель BB-кодов
    • BB-коды
    • Валидаторы форм
    • Индексы полей ввода
    • Всплывающие подсказки
    • Подсвечивающиеся блоки
    • Всплывающие блоки
    • Слайдер
    • Автозаполнение
    • Селектор тегов
    • Блоки оповещений
    • Селекторы даты и времени
    • Якоря
  • 📧Контакты
  • 🔁GitHub
Powered by GitBook
On this page
  1. Компоненты

Якоря

PreviousСелекторы даты и времениNextКонтакты

Last updated 2 years ago

Якоря позволяют организовать переход к элементу с анимацией

<ul class="nav-menu">
    <li class="nav-menu-item"><a href="#" data-anchor="#achor-1" class="nav-menu-link" rel="nofollow">Anchor link #1</a></li>
    <li class="nav-menu-item"><a href="#" data-anchor="#achor-2" class="nav-menu-link" rel="nofollow">Anchor link #2</a></li>
    <li class="nav-menu-item"><a href="#" data-anchor="#achor-3" class="nav-menu-link" rel="nofollow">Anchor link #3</a></li>
    <li class="nav-menu-item"><a href="#" data-anchor="#achor-4" data-anchor-duration="1000" class="nav-menu-link" rel="nofollow">Anchor with custom duration</a></li>
    <li class="nav-menu-item"><a href="#" data-anchor="#achor-5" data-anchor-duration="2000" data-anchor-easing="easeOutBounce" class="nav-menu-link" rel="nofollow">Anchor with custom easing</a></li>
    <li class="nav-menu-item"><a href="#" data-anchor="#achor-6" data-anchor-hash="true" class="nav-menu-link" rel="nofollow">Anchor with hash change</a></li>
</ul>
Полный пример кода выше