Выпадающий список документов 
Author: Александр Ч.
Visited 1227,
Followers 1,
Shared 0
- Как сделать выпадающий список, нужно сделать смету на сайт , но чтобы все позиции сразу не видны были , разделами , есть ли такая возможность в программе?
Posted on the
Есть платный объект https://market.websitex5.com/ru/objekty/526c4939-3abc-41c3-b34a-37baa6a14af
Ну если ничего гениального ненадо то вот держи простой код
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
.accordion {
background-color: #eee;
color: #444;
cursor: pointer;
padding: 18px;
width: 100%;
border: none;
text-align: left;
outline: none;
font-size: 15px;
transition: 0.4s;
}
.active, .accordion:hover {
background-color: #ccc;
}
.panel {
padding: 0 18px;
display: none;
background-color: white;
overflow: hidden;
}
</style>
</head>
<body>
<h2>Accordion</h2>
<button class="accordion">Section 1</button>
<div class="panel">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
</div>
<button class="accordion">Section 2</button>
<div class="panel">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
</div>
<button class="accordion">Section 3</button>
<div class="panel">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
</div>
<script>
var acc = document.getElementsByClassName("accordion");
var i;
for (i = 0; i < acc.length; i++) {
acc[i].addEventListener("click", function() {
this.classList.toggle("active");
var panel = this.nextElementSibling;
if (panel.style.display === "block") {
panel.style.display = "none";
} else {
panel.style.display = "block";
}
});
}
</script>
</body>
</html>
Текст сам поменяешь стили можешь подкинуть
... Хорошо, но нет! эти теги
:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<h2>Accordion</h2>
</body>
</html>
.
ciao
.
(It > Ru) ... или на этой странице, уже отформатированной со всеми видимыми разделами, было применено мое эксклюзивное изобретение, чтобы закрывать и открывать разделы, щелкая по их заголовкам ...
> LINK образец страницы: https://osteopathfabio.com/article-download-file-document-exercise.html
> Справочная тема: https://helpcenter.websitex5.com/en/post/230436
.
ciao
.
Ну я же в общих чертах)))