Как сделать появление блока при нажатии на ссылку на CSS? Мне нужно, что бы блок(.map) появлялся при наведении на ссылку(#map_sh). Пробовал сделать таким кодом:#map_sh:focus+.map {
display: block;
}
Но ничего не получилось. Фот сайт на котором я это делаю.Решил проблему JavaScript кодом.function showHide(element_id) {
if (document.getElementById(element_id)) {
var obj = document.getElementById(element_id);
if (obj.style.display != "block") {
obj.style.display = "block";
} else obj.style.display = "none";
}
}

21 Авг 2019 в 06:33
243 +1
0
Ответы
1

Solution using CSS:

You can achieve this functionality using CSS by using the :hover pseudo-class instead of :focus. Here's an example:

HTML:

<a href="#" id="map_sh">Show Map</a>
<div class="map">
Map content here
</div>

CSS:

.map {
display: none;
}
#map_sh:hover + .map {
display: block;
}

With this CSS code, the .map element will be displayed when the #map_sh link is hovered over.

If you still want to use JavaScript, you can use the following code:

HTML:

<a href="#" id="map_sh" onclick="showHide('map')">Show Map</a>
<div class="map" id="map">
Map content here
</div>

JavaScript:

function showHide(element_id) {
if (document.getElementById(element_id)) {
var obj = document.getElementById(element_id);
if (obj.style.display != "block") {
obj.style.display = "block";
} else {
obj.style.display = "none";
}
}
}

With this JavaScript code, clicking on the #map_sh link will toggle the display of the .map element.

20 Апр 2024 в 13:16
Не можешь разобраться в этой теме?
Обратись за помощью к экспертам
Гарантированные бесплатные доработки в течение 1 года
Быстрое выполнение от 2 часов
Проверка работы на плагиат
Поможем написать учебную работу
Прямой эфир