Используйте селектор CSS для стилизации соседних изображений при наведении курсора.
Обычно вам понадобится JavaScript для стилизации всех братьев и сестер элемента, с которым вы взаимодействуете. Но ждать! Есть классный метод, основанный на 100% CSS.
Короче говоря, идея состоит в том, чтобы нацелиться на: hover
родительского элемента, а затем нацелить его на всех дочерних элементов, кроме того, над которым вы наводите курсор.
.parent:hover .child:not(:hover) {
/* this style affects all the children except the one you're hovering over */
}
Вот пример:
Вот и всё!