Смена изображения при наведении на другой объект

Рейтинг: -1Ответов: 1Опубликовано: 05.02.2023

Мне нужно сделать так чтобы изображение в кнопке менялось при наведении на кнопку. Вот код:

<button class="followed-button">
    <img src="../img/heart.png" class="follow-img">
</button>
css javascript html
Источник: Stack Overflow на русском

Ответы

▲ 1

Без JS можно сделать что-то такое

HTML:

<button class="followed-button">
  <img src="" class="default"/>
  <img src="" class="on-hover"/>
</button>

CSS:


.followed-button > .default {
  display: block; /* или другое нужное значение */
}

.followed-button > .on-hover {
  display: none;
}

.followed-button:hover > .on-hover {
  display: block; /* или другое нужное значение */
}

.followed-button:hover > .default {
  display: none;
}