Очень актуальный и эффектный способ показать изображение на которое можно кликнуть с помощью увеличения картинки внутри шейпа.
Для применения модификации следуйте инструкции:
Для применения модификации следуйте инструкции:
- Создайте зеро-блок и в нем элемент Shepe
- Присвойте элементу класс .Cube-zoom (Клик правой кнопкой мыши по элементу Add CSS Class Name)
- Создайте блок Т123
- Добавьте код из инструкции
- Настройте параметры отображения в коде
- Опубликуйте страницу
<!-- Увеличение изображения в Шейпе Cubeteam.ru-->
<style>
.Cube-zoom {
border-radius: 10px;
overflow: hidden;
}
.Cube-zoom .tn-atom {
border-radius: 10px;
transition: transform 150ms ease-in-out;
}
.Cube-zoom:hover .tn-atom {
transform: scale(110%);
}
</style>