@Sodasss

Как добавить класс active в миниатюру статьи?

Здравствуйте, подскажите, как сделать что бы одно изображения всегда было видимым, и оставалась видимым, на которое последний раз навели курсором.
На макете всё выглядит так:
60e6d84f97188630886160.jpeg
Я вывил последние записи так:
<div class="post-container">
			<?php query_posts('showposts=5'); ?>
			<?php while (have_posts()) : the_post(); ?>
			<?php if ( has_post_thumbnail()) { ?>
				<div class="">
								<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>" >
									<h3><?php the_title(); ?></h3>
				<?php the_post_thumbnail(); ?>
			</a>
				</div>
		<?php } ?>
		<?php endwhile; ?>
		</div>

и зада "opacity: 0;", а в hover; opacity: 1;
Но не понимаю, как сделать что бы одна всегда была активной и класс сохранялся у последней наведенной записи
  • Вопрос задан
  • 31 просмотр
Пригласить эксперта
Ответы на вопрос 1
e_snegirev
@e_snegirev
что-то типа
const banners = document.querySelectorAll('.block');
banners.forEach(banner => {
  banner.addEventListener('mouseenter', (event) => {
    banners.forEach(innerBanner => innerBanner.classList.remove('active'));
    event.target.classList.add('active');
  });
});
Ответ написан
Ваш ответ на вопрос

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

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