Javascript - баян не рухнул - PullRequest
1 голос
/ 07 марта 2019

С помощью этой статьи я создал аккордеон javascript.

Единственная проблема в том, что он не начинает рушиться, и я не могу понять, что так.

Спасибо за вашу помощь

CODEPEN

<div id="toggle-button1" class="section akkordeon">
<div class="akkordeon-title">LOREM IPSUM TITLE</div>
<div id="akkordeon-content1" class="section collapsible">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</div>
</div>

Ответы [ 3 ]

1 голос
/ 07 марта 2019
var section = document.querySelector('#akkordeon-content1');
collapseSection(section)

добавьте этот код в свой javascript. вне чего-либо

1 голос
/ 07 марта 2019

Просто сделайте ваш контейнер скрытым по умолчанию.

.collapsible {
   height: 0;
}

И удалите эту строку из кода, чтобы она не свернулась назад:

//(line 42) element.style.height = null;
1 голос
/ 07 марта 2019

Добавьте несколько CSS, чтобы установить начальное значение 0

#akkordeon-content1 {
  height: 0;
}

Также есть элемент HTML под названием details , который выполняет эту функцию за вас.

<details>
    <summary>Details</summary>
    Something small enough to escape casual notice.
</details>

Документация: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details

...