Установка скрипта «Адаптивный слайдер»

Введение


При помощи этого скрипта вы сможете в автоматическом режиме сохранять пропорции слайдера в соответствии с изображениями, используемыми в нём, при этом точно настраивать высоту слайдера в конструкторе не требуется — всё адаптируется автоматически.
Примечание: Рекомендуется чтобы все изображения в слайдере были одинакового размера для лучшей адаптации.

    Требования к установке:
  • оплаченный тариф «Премиум» или «Про» (для самостоятельной установки);

Перед установкой, сделайте бекап вашего сайта на случай, если вы в какой-то момент решите вернуть прежний вид сайту или отдельным его элементам. Сделать это можно в режиме конструктора во вкладке Бекапы.

Установка

Перейдите в панель управления вашего сайта в раздел «Свой код». В редактор вставьте следующий код:

<style>
#body .ul-slider-wysy .ul-image {min-height:100px;}
</style>
<script>
  require(['jquery'], function ($) {
      setInterval(function() {
        var sliderheight = H / W * $('.ul-slider-wysy .ul-image').width();
        $('.ul-slider-wysy .ul-image').css('height',sliderheight);
      },100)
  });
</script>

Где W — ширина в пикселях наименьшего изображения в слайдере, а H — высота наименьшего изображения в слайдере. Во вкладке «Настройки» в разделе «Выводить код» отметьте пункт «В конец <body>». Выберите страницу, где расположен ваш слайдер.

Сохраните код и опубликуйте ваш сайт.