WebSite X5Help Center

 
Александр Ч.
Александр Ч.
User

Выпадающий список документов  ru

Autore: Александр Ч.
Visite 837, Followers 1, Condiviso 0  

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

Postato il
5 RISPOSTE
Максим Г.
Максим Г.
User

Ну если ничего гениального ненадо  то вот держи простой код

<!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>

Текст сам поменяешь   стили можешь подкинуть 

Leggi di più
Postato il da Максим Г.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Маким Г.
Ну если ничего гениального ненадо  то вот держи простой код ... ... ... ... 

... Хорошо, но нет! эти теги wink :

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<h2>Accordion</h2>
</body>
</html>

.

ciao

.

Leggi di più
Postato il da  ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

(It > Ru) ... или на этой странице, уже отформатированной со всеми видимыми разделами, было применено мое эксклюзивное изобретение, чтобы закрывать и открывать разделы, щелкая по их заголовкам ...

> LINK образец страницы:  https://osteopathfabio.com/article-download-file-document-exercise.html
> Справочная тема: https://helpcenter.websitex5.com/it/post/230436

.

ciao

.

Leggi di più
Postato il da  ‪ KolAsim ‪ ‪
Максим Г.
Максим Г.
User
 ‪ KolAsim ‪ ‪
Маким Г. Ну если ничего гениального ненадо  то вот держи простой код ... ... ... ...  ... Хорошо, но нет! эти теги  :

Ну я же в общих чертах)))

Leggi di più
Postato il da Максим Г.