将外部javascript链接到wordpress页面

时间:2018-07-17 14:48:25

标签: javascript html css wordpress

我正在尝试在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>

感谢您的帮助 特里斯坦

0 个答案:

没有答案