我正在尝试在wordpress上制作一个带有手风琴列表图标的页面。我已经用elementor完成了,但是我不想使用elementor。示例在这里:www.adwokat-panek.pl/zakres-uslug。我的代码来自w3school网站,当我在html预览器中对其进行测试时,所有代码都可以正常运行,即使在此代码段中也可以正常运行,但在wordpress网站上却无法正常工作。 html粘贴在wordpress的编辑页面上,而css和javascript则在我的wordpress目录中的外部文件中。我知道外部文件是使用enqueue进行注册和正确调用的,因为其他javascript都能正常工作。
javascript位于我的主题文件夹/js/script.js
编辑:似乎javascript未链接到html或未与html一起运行。
编辑2:外部javascript正确地被列队,因为如果在网站上的所有页面上都可以使用同一文件中的另一个javascript功能。它只是一个警报功能,每次加载页面时都会显示警报。但是我的手风琴功能无法正常工作...
var acc = document.getElementsByClassName("accordion");
var i;
for (i = 0; i < acc.length; i++) {
acc[i].addEventListener("click", function accordlist() {
this.classList.toggle("active");
var panel = this.nextElementSibling;
if (panel.style.maxHeight){
panel.style.maxHeight = null;
} else {
panel.style.maxHeight = panel.scrollHeight + "px";
}
});
}
* {
box-sizing: border-box;
}
/* Create two equal columns that floats next to each other */
.column {
float: left;
width: 50%;
padding: 10px;
}
/* Clear floats after the columns */
.row:after {
content: "";
display: table;
clear: both;
}
.margin {
margin-top: 50px;
}
.icon:hover {
color: #014222;
-webkit-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
transform: scale(1.1);
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
text-decoration: none;
}
.accordion {
background-color: transparent;
color: #014222;
font-weight: bold;
cursor: pointer;
padding: 18px;
width: 100%;
border: none;
text-align: center;
outline: none;
outline-width: thin;
outline-color: #014222;
font-size: 22px;
font-family: cormorant garamond;
transition: 0.4s;
}
.active, .accordion:hover {
background-color: transparent;
color: #014222;
}
.accordion:after {
content: '';
color: #014222;
font-weight: bold;
font-size: px;
float: center;
margin-left: 5px;
}
button:focus {
outline: 0;
}
.active:after {
content: '';
color: #014222;
}
.panel {
padding: 0 0px;
background-color: transparent;
max-height: 0;
overflow: hidden;
transition: max-height 0.2s ease-out;
text-align: left;
font-family: cormorant garamond;
font-weight: 500;
font-size: 16px;
list-style-position: outside;
list-style-type: none;
margin-left: 0px;
}
.ul {
margin-left: 50px;
}
/* Nasz Zepol section on homepage */
/*.nzh {
box-sizing: border-box;
}
/* Create two equal columns that floats next to each other */
.nzcolumn {
float: left;
width: 50%;
padding: 10px;
}
/* Clear floats after the columns */
.nzrow:after {
content: "";
display: table;
clear: both;
}
.nznametitle {
font-weight: bold;
}
<div class="row margin">
<div class="column" style="background-color:#aaa;">
</head>
<body>
<button class="accordion icon"><img src="http://www.adwokat-panek.pl/wp-content/uploads/2018/07/GREENgavel.svg" width="15%" alt="Cywilne"/>
<br/>
Prawo Cywilne</button>
<div class="panel">
<ul class="ul">
<li>sprawy o zapłatę</li>
<li>sprawy z zakresu ochrony dóbr osobistych</li>
<li>dochodzenie odszkodowań zadośćuczynień oraz rent</li>
<li>dochodzenie roszczeń za wypadki komunikacyjne oraz szkody medyczne</li>
<li>dochodzenie roszczeń od ubezpieczycieli</li>
<li>przywrócenie posiadania i ochrona własności</li>
<li>windykacja należności</li>
<li>ubezwłasnowolnienie</li>
<li>sporządzanie regulaminów, w tym regulaminów sklepów internetowych</li> <li>sporządzanie i opiniowanie umów</li>
<li>sprawy spadkowe</li>
<li>sprawy wieczystoksięgowe</li>
<li>sprawy z zakresu ochrony praw autorskich</li>
<li>obsługa rolników i pomoc w obrocie gruntami rolnymi</li>
</ul>
</div>
</div>
<div class="column" style="background-color:#bbb;">
<button class="accordion icon"><img src="http://www.adwokat-panek.pl/wp-content/uploads/2018/07/GREENfamily-silhouette.svg" width="14%" alt="Rodzinne"/>
<br/>
Prawo Cywilne</button>
<div class="panel">
<ul class="ul">
<li>rozwody i separacje</li>
<li>sprawy o ustalenie rozdzielności majątkowej małżeńskiej</li>
<li>podział majątku wspólnego małżonków</li>
<li>alimenty</li>
<li>kontakty z dziećmi</li>
<li>ograniczenie i pozbawienie władzy rodzicielskiej</li>
<li>ustalenie ojcostwa</li>
<li>sprawy dotyczące opieki i kurateli</li>
</ul>
</div>
</div>
</div>
<div class="row margin">
<div class="column" style="background-color:#aaa;">
<button class="accordion icon"><img src="http://www.adwokat-panek.pl/wp-content/uploads/2018/07/GREENtown-hall.svg" width="17%" alt="Administracyjne"/>
<br/>
Prawo Administracyjne</button>
<div class="panel">
<ul class="ul">
<li>obsługa organów samorządu</li>
<li>sporządzanie odwołań od decyzji organów administracyjnych</li>
<li>sporządzanie skarg do WSA i skarg kasacyjnych do NSA</li>
<li>pomoc w zakładaniu oraz obsługa stowarzyszeń i fundacji</li>
<li>pomoc w przekształceniach oraz podziałach i scalaniu gruntów</li>
<li>pomoc w uzyskiwaniu decyzji środowiskowej pozwoleń na zbieranie i przetwórstwo odpadów</li>
<li>polityka ochrony danych osobowych</li>
</ul>
</div>
</div>
<div class="column" style="background-color:#bbb;">
<button class="accordion icon"><img src="http://www.adwokat-panek.pl/wp-content/uploads/2018/07/GREENtie.svg" width="13%" alt="Prawo Pracy i Ubezpieczeń Społecznych"/>
<br/>
Prawo Pracy i Ubezpieczeń Społecznych</button>
<div class="panel">
<ul class="ul">
<li>sprawy o zapłatę wynagrodzenia ekwiwalentu za niewykorzystany urlop</li>
<li>wynagrodzenia za nadgodziny</li>
<li>odszkodowania za okres wypowiedzenia</li>
<li>sprawy o przywrócenie do pracy lub o odszkodowanie za niezgodne z prawem rozwiązanie umowy o pracę</li>
<li>sprostowanie świadectwa pracy</li>
<li>sprawy rentowe i emerytalne</li>
<li>dochodzenie roszczeń za wypadki przy pracy</li>
<li>pomoc w zatrudnianiu cudzoziemców (Ukraińców, Białorusinów, Mołdawian, etc.)</li>
</ul>
</div>
</div>
</div>
<div class="row margin">
<div class="column" style="background-color:#aaa;">
<button class="accordion icon"><img src="http://www.adwokat-panek.pl/wp-content/uploads/2018/07/GREENhandcuffs.svg" width="15%" alt="Karne"/>
<br/>
Prawo Karne</button>
<div class="panel">
<ul class="ul">
<li>obrona na etapie postępowania przygotowawczego i sądowego</li>
<li>zawiadomienia o podejrzeniu popełnieniu przestępstwa i wnioski o ściganie</li>
<li>sporządzanie prywatnych aktów oskarżenia</li>
<li>reprezentowanie skazanych w postępowaniach wykonawczych, w tym w sprawach o odroczenie wykonania kary przerwę w wykonywaniu kary pozbawienia wolności oraz warunkowe przedterminowe zwolnienie</li>
<li>wnioski o dozór elektroniczny</li>
<li>reprezentowanie osób pokrzywdzonych popełnieniem przestępstwa</li>
</ul>
</div>
</div>
<div class="column" style="background-color:#bbb;">
<button class="accordion icon"><img src="http://www.adwokat-panek.pl/wp-content/uploads/2018/07/GREENhandshake.svg" width="15%" alt="Gospodarcze"/>
<br/>
Prawo Gospodarcze</button>
<div class="panel">
<ul class="ul">
<li>bieżąca obsługa prawna związana z działalnością podmiotów gospodarczych</li>
<li>zakładanie i przekształcanie spółek</li>
<li>pomoc prawna w sprawach rejestrowych (KRS)</li>
<li>przygotowywanie i opiniowanie umów oraz uchwał i protokołów</li>
<li>bieżące doradztwo prawne</li>
<li>prowadzenie spraw egzekucyjnych</li>
<li>wnioski o upadłość konsumencką</li>
<li>rejestrowanie znaków towarowych</li>
<li>dochodzenie roszczeń z tytułu nieuczciwej konkurencji</li>
</ul>
</div>
</div>
</div>
<div class="row margin">
<div class="column" style="background-color:#aaa;">
<button class="accordion icon"><img src="http://www.adwokat-panek.pl/wp-content/uploads/2018/07/GREENbuilding1.svg" width="15%" alt="Budowlane"/>
<br/>
Prawo Budowlane</button>
<div class="panel">
<ul class="ul">
<li>przygotowywanie i opiniowanie umów deweloperskich, rezerwacyjnych oraz przedwstępnych</li>
<li>obsługa procesu inwestycyjnego, w tym pomoc w uzyskiwaniu warunków zabudowy, pozwolenia na budowę oraz zgody na użytkowanie</li>
<li>dochodzenie odszkodowań za spadek wartości nieruchomości</li>
<li>pomoc w uzyskiwaniu pozwoleń na budowę</li>
<li>legalizacja samowoli budowlanych</li>
<li>reprezentowanie przed organami nadzoru budowlanego</li>
<li>zaskarżanie miejscowych planów zagospodarowania przestrzennego</li>
</ul>
</div>
</div>
<div class="column" style="background-color:#bbb;">
<button class="accordion icon"><img src="http://www.adwokat-panek.pl/wp-content/uploads/2018/07/GREENicon.svg" width="14%" alt="China Hongkong"/>
<br/>
Usługi Prawne w Chinach i Hongkongu</button>
<div class="panel">
<ul class="ul">
<li>rejestracja znaków towarowych w Chinach i Hongkongu</li>
<li>windykacja należności</li>
<li>pomoc prawna w eksporcie i imporcie</li>
</ul>
</div>
</div>
</div>
感谢您的帮助 特里斯坦