|
|
Line 5: |
Line 5: |
| <link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" | | <link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" |
| integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous"> | | integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous"> |
− | <script>
| |
− | /********************************* expand panels ********************************/
| |
− | var acc = document.getElementsByClassName("accordion");
| |
− | var i;
| |
− | console.log(acc)
| |
− | for (i = 0; i < acc.length ; i++) {
| |
− | acc[i].addEventListener("click", function() {
| |
− | this.classList.toggle("active");
| |
− | var panel = this.nextElementSibling;
| |
− | if (panel.style.maxHeight) {
| |
− | panel.style.maxHeight = null;
| |
− | } else {
| |
− | panel.style.maxHeight = (panel.scrollHeight + "px");
| |
− | }
| |
− | });
| |
− | }
| |
− |
| |
− |
| |
− |
| |
− | function openAll(expt) {
| |
− | console.log("click active")
| |
− | var i, panelList;
| |
− | panelList = document.getElementsByClassName(expt);
| |
− | console.log(panelList)
| |
− |
| |
− |
| |
− | for (i = 2; i < panelList.length; i++) {
| |
− | if (panelList[i].style.maxHeight == 0) {
| |
− | console.log(panelList[i].style.maxHeight)
| |
− | panelList[i].style.maxHeight = panelList[i].scrollHeight + "px"
| |
− | console.log("open")
| |
− | panelList[0].style.color = "#F76C6C";
| |
− | panelList[1].style.color = "#F76C6C";
| |
− | panelList[1].style.transform = "rotate(180deg)"
| |
− |
| |
− | } else {
| |
− | console.log(panelList[i].style.maxHeight)
| |
− | panelList[i].style.maxHeight = null ;
| |
− | console.log("close");
| |
− | panelList[0].style.color = "#374785";
| |
− | panelList[1].style.color = "#374785";
| |
− | panelList[1].style.transform = "rotate(0deg)";
| |
− | }
| |
− | }
| |
− |
| |
− | }
| |
− |
| |
− | /*********************************collapsible dropdowns********************************/
| |
− |
| |
− | var coll = document.getElementsByClassName("collapsible");
| |
− | var i;
| |
− |
| |
− | for (i = 0; i < coll.length; i++) {
| |
− | coll[i].addEventListener("click", function() {
| |
− | this.classList.toggle("active");
| |
− | var drop = this.nextElementSibling;
| |
− | if (drop.style.display === "block") {
| |
− | drop.style.display = "none";
| |
− | } else {
| |
− | drop.style.display = "block";
| |
− | }
| |
− | });
| |
− | }
| |
− | =
| |
− |
| |
− | </script>
| |
| | | |
| | | |