@xuodarri

Как сделать чтобы кнопку, которая будет влиять на содержимое другого блока?

Хочу реализовать на сайте страницу точки продаж: сверху высокий блок с Гугл (Яндекс) картой, под ним 3 коротких блока в колонку с описанием конкретных магазинов. в каждом из описании есть кнопка "показать адрес".

1) как реализовать по нажатию на эту кнопку смену встраиваемой карты? (не обязательно на примере карты, в примере прикрепил код, подчеркну, задача в том, чтобы при нажатии на кнопку изменялся сам блок, а не его цвет)

2) отдельно буду признателен, если реализация подойдёт для n-ого количества магазинов, т.е. автоматически будет высчитываться порядковый номер кнопки и относительно него будет отображаться контент в блоке.
<div class="shop shop-1">1</div>
<div class="shop shop-2">2</div>
<div class="shop shop-3">3</div>
<button class="shop__btn shop__btn-1">показать 1</button>
<button class="shop__btn shop__btn-2">показать 2</button>
<button class="shop__btn shop__btn-3">показать 3</button>


Хочу реализовать на сайте страницу точки продаж: сверху высокий блок с Гугл (Яндекс) картой, под ним 3 коротких блока в колонку с описанием конкретных магазинов. в каждом из описании есть кнопка "показать адрес".

как реализовать по нажатию на эту кнопку смену встраиваемой карты? (не обязательно на примере карты, в примере прикрепил код, подчеркну, задача в том, чтобы при нажатии на кнопку изменялся сам блок, а не его цвет)

отдельно буду признателен, если реализация подойдёт для n-ого количества магазинов, т.е. автоматически будет высчитываться порядковый номер кнопки и относительно него будет отображаться контент в блоке. введите сюда описание изображения

.shop {
width: 100%;
height: 100px;
color: #fff;
}

.shop-1 {
background: red;
}

.shop-2 {
background: blue;
}

.shop-3 {
background: yellow;
}
  • Вопрос задан
  • 82 просмотра
Пригласить эксперта
Ответы на вопрос 1
@todaystudio
https://codepen.io/todaystudio/pen/zYaNear
Вот один из простых способов
Ответ написан
Комментировать
Ваш ответ на вопрос

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

Похожие вопросы