Скругление фото при скролле
Модификатор для скругления нижних углов изображения при скролле
jQuery
Для корректной работы блоков подключите библиотеку jQuery:
Инструкция с подключением кода
Настройки сайта -> Еще -> Подключить jQuery на страницах сайта
  1. Добавляем шейп и загружаем в него ваше изображение.
  2. Задаем класс шейпу tistols-bbord
Код скопирован!
Скопировать код
Шаг 2
Добавляем блок T123
  1. Копируем в него код
Шаг 1
Создаем Zero Block и открываем редактор
<script>
// Добавляем обработчик события прокрутки с использованием jQuery
$(window).scroll(function() {
// Получаем верхнюю границу элемента
var elementTop = $('.tistols-bbord .tn-atom').offset().top;
// Получаем количество прокрученных пикселей от верха окна
var scrolledPixels = $(window).scrollTop();
// Проверяем, достиг ли верх элемента верха экрана
if (elementTop <= scrolledPixels) {
// Если достиг, рассчитываем значение для скругления углов
var borderRadiusValue = (scrolledPixels - elementTop) * 0.8;
// Применяем стили для скругления углов
$('.tistols-bbord .tn-atom').css('border-radius', `0 0 ${borderRadiusValue}px ${borderRadiusValue}px`);
} else {
// Если верх элемента не достиг верха экрана, сбрасываем скругление
$('.tistols-bbord .tn-atom').css('border-radius', '0');
}
});
</script>
Шаблон страницы
Код скопирован!
70351983
Нажми, чтобы скопировать номер
Текст скопирован в буфер обмена!
Текст скопирован в буфер обмена!
Вам также может быть интересно:
Подпишитесь на наши обновления в телеграм