Good evening friends! The question is, there is a piece of code (below), the problem is that I do not understand what it is doing (superficial understanding)

<script type="text/javascript"> var step = 2; function expandPanel() { var panel = document.getElementById("panel") if (panel.clientHeight < (panel.originalHeight-step)) { var h = panel.clientHeight + step; panel.style.height = h+"px"; setTimeout("expandPanel()",25) } else { panel.style.height = "100px"; var panelTitle = document.getElementById("panelTitle") panelTitle.firstChild.nodeValue = "Свернуть" } } function collapsePanel() { var panel = document.getElementById("panel") if (panel.clientHeight >= step) { var h = panel.clientHeight - step panel.style.height = h+"px"; setTimeout("collapsePanel()",25) } else { panel.style.display = "none"; var panelTitle = document.getElementById("panelTitle") panelTitle.firstChild.nodeValue = "Развернуть" } } function changePanel() { var panel = document.getElementById("panel") if (!panel.style.height || (panel.style.display == "none")) { if (panel.style.display == "none") { panel.style.display = "" expandPanel() } else { panel.originalHeight = panel.clientHeight collapsePanel(); } } } </script> 
  • one
    And did not try to start and see? In general, it is written in Russian in English - it collapses and unwinds the animation panel (the first part of each ifʻa). - BOPOH
  • I understood this part, but what should be in the HTML part is not clear, that is, what to deploy and what to collapse. - Goldy

1 answer 1

Collapses and expands the element. For example, <div id = "panel"> </ div>, <div id = "panelTitle"> </ div>.

What is there is not clear and not important. The bottom line is that this is something like a tab button. Which then showed the contents, it hid.