Кнопки прокрутки («уши»)
Подключение
Javascript-расширение ui.ears
позволяет подключить для нужного элемента на странице кнопки прокрутки («уши»).
Доступно с ui 20.5.400.
\Bitrix\Main\UI\Extension::load("ui.ears");
Использование
В js-коде необходимо инициализировать «ушки».
<div class="container"></div> const ears = new Ears({ container: document.querySelector('.container'), smallSize: true, noScrollbar: true }); ears.init();
В параметр container
необходимо передать класс контейнера, где хранятся те элементы, которые нужно прокручивать.
Дополнительные параметры:
smallSize
. Параметр, влияющий на размер «ушей». По умолчанию высота «ушей» 94px. Если передать smallSize, то размер будет 75px.noScrollbar
. По умолчанию скроллбар виден, с помощью этого параметра можно его скрыть.className
. Через него можно задать свой класс.
Дополнительно есть возможность автоматической прокрутки к выбранному элементу, если он скрыт за пределами видимости. Для этого нужному элементу необходимо добавить атрибут data-role="ui-ears-active"
.
Пример работы:
Сообщение не промодерировано, возможны ошибки и неточности.
|
||
Чтобы получилось вот так const ears = new BX.UI.Ears | ||
Сообщение не промодерировано, возможны ошибки и неточности.
|
Как обычно ничего не работает
<?php require($_SERVER["DOCUMENT_ROOT"]."/bitrix/header.php"); use Bitrix\Main\UI\Extension; Extension::load('ui.ears'); ?> <div class="container"> 123 </div> <script> const ears = new Ears({ container: document.querySelector('.container'), smallSize: true, noScrollbar: true }); ears.init(); </script> <?php require($_SERVER["DOCUMENT_ROOT"]."/bitrix/footer.php"); ?> Ошибка ReferenceError: Can't find variable: Ears |
© «Битрикс», 2001-2024, «1С-Битрикс», 2024
Пользовательские комментарии
Мы будем рады, если разработчики добавят свои комментарии по практическому использованию методов системы.Для этого нужно всего лишь авторизоваться на сайте
Но помните, что Пользовательские комментарии, несмотря на модерацию, не являются официальной документацией. Ответственность за их использование несет сам пользователь.
Также Пользовательские комментарии не являются местом для обсуждения функционала. По подобным вопросам обращайтесь на форумы.