Как сделать такой эффект?

Доброго дня всем.

На этом сайте - https://likadress.ru/ имеется интересный эффект, когда при наведении на картинку появляется дополнительная инфа с параметрами и возможностью выбирать размеры и добавления в корзину. Такой вопрос - для этого есть какое-то готовое решение или все нужно писать самому?

Спасибо
  • Вопрос задан
  • 150 просмотров
Пригласить эксперта
Ответы на вопрос 1
@yvetrov
Готовые решения есть всегда, тут можно все реализовать с помощью display: none/class & JS. В html элементах, которые относишь к "скрытым" - прописываешь свойство стилей

<button style='display: none;'>Кнопка</button>.

Дальше уже вешаешь обработчик событий на элемент. При наведении на элемент срабатывает функция-обработчик, в ней прописываешь смену display с none, на block/inline-block/flex/grid; Делаешь условие, что если курсор вышел из области - сбросить стили до display: none; Как пример, можешь еще попробовать сделать через класс active/inactive. Вместо кнопки можешь сделать спокойно изображение или что-то другое, просто меняешь на что-то свое, в любом случае, делегирование тебе поможет.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы