2 раздельно открываемый ul
257
16 сентября 2018, 12:40
"Открыть подменю" 2 и их открывать поочередно, при открытие первого закрыть второе, при закрытие второго- открывать первый
<script>
function toggle(el)
{
el.style.display = (el.style.display == 'none') ? 'block' : 'none';
}
</script>
<a onclick="toggle(document.getElementById('sub-menu'))">Открыть подменю</a>
<div id="dd" style="display:none">+</div>
<ul id="sub-menu" style="display:none">
<li><a href="#1">подпункт 1</a></li>
<li><a href="#2">подпункт 2</a></li>
<li><a href="#3">подпункт 3</a></li>
</ul>
Answer 1
Вот небольшой пример:
.cd-accordion-menu input[type=checkbox] {
position: absolute;
opacity: 0;
}
.cd-accordion-menu label, .cd-accordion-menu a {
position: relative;
display: block;
padding: 18px 18px 18px 64px;
background: #4d5158;
box-shadow: inset 0 -1px #555960;
color: #ffffff;
font-size: 1.6rem;
}
.cd-accordion-menu ul {
display: none;
}
.cd-accordion-menu input[type=checkbox]:checked + label + ul,
.cd-accordion-menu input[type=checkbox]:checked + label:nth-of-type(n) + ul {
display: block;
}<ul class="cd-accordion-menu">
<li class="has-children">
<input type="checkbox" name ="group-1" id="group-1" checked>
<label for="group-1">Group 1</label>
<ul>
<li class="has-children">
<input type="checkbox" name ="sub-group-1" id="sub-group-1">
<label for="sub-group-1">Sub Group 1</label>
<ul>
<li><a href="#0">Image</a></li>
<li><a href="#0">Image</a></li>
<li><a href="#0">Image</a></li>
</ul>
</li>
<li><a href="#0">Image</a></li>
<li><a href="#0">Image</a></li>
</ul>
</li>
<li><a href="#0">Image</a></li>
<li><a href="#0">Image</a></li>
</ul> 
-
06:53
Апостиль в Лос-Анджелесе без лишних нервов и бумажной волокиты
-
20:42
-
09:21
Основные этапы разработки сайта для стоматологической клиники
-
12:26
-
10:30
-
18:43
Продвижение своими сайтами как стратегия роста и независимости
-
22:46
-
06:18
-
12:23
ТОП-10
- Почему SERVER_ADDR имеет не тот IP 50307 visits
- Как заменить $_SERVER[REMOTE_ADDR] на IP клиента в PHP за двумя Nginx? 31941 visits
- Хочу вывести несколько строк из массива в один div, выводит только много undefined; подскажите, что делать? 26283 visits
- Как через css изменить цвет png изображения? 11765 visits
- Blob video url download 11312 visits
- Php curl запрос через прокси с авторизацией 10721 visits
- Работа с captcha vk api 9517 visits
![All parts of a PRIMARY KEY must be NOT NULL; if you need NULL in a key, use UNIQUE instead [закрыт]](https://hostciti.net/images/nophoto.png "All parts of a PRIMARY KEY must be NOT NULL; if you need NULL in a key, use UNIQUE instead [закрыт]")
© "hostciti.net" 19.3.2026 | 19:44