Nie chce korzystać z jakiś gotowych pluginów do WP bo jedynie utrudnię sobie zadanie.
Mam problem z menu w projekcie szablonu pod WP, w HTML wszystko ładnie wygląda ale gdy przerzucę to na WP to już nie wszystko będzie tak pięknie. Chodzi mi dokładnie o menu i submenu. Nie bawie się w hovery bo na telefonie (w moim przypadku) muszę mocniej naciskać a czasami i to nie działa, dlatego bawie się w "klikalne" submenu. No i do tego używam nastepującego, prostego kodu:
$(document).ready(function() {
$('.dropdown').click(function() {
$('.dropdown-menu').slideToggle(500);
});
});
Szkielet menu wygląda następująco:
<ul class="navbar-nav">
<li><a href="#">Home</a></li>
<li><a href="#">Events</a></li>
<li><a href="#">Forum</a></li>
<li class="dropdown"><a href="#" class="dropdown-toggle">Tutorials <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Polish</a></li>
<li><a href="#">English</a></li>
<li><a href="#">Turkey</a></li>
</ul>
</li>
<li><a href="#">Social</a></li>
<li><a href="#">Video</a></li>
<li class="dropdown"><a href="#" class="dropdown-toggle">Others <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Polish</a></li>
<li><a href="#">English</a></li>
<li><a href="#">Turkey</a></li>
</ul>
</li>
</ul>
Jest to fragment menu z bootstrapa ale nie chce wykorzystuje go w 100% bo mi po prostu nie odpowiada. No i nie trzeba być geniuszem aby wiedzieć, że po kliknięciu w li, które jako klase ma .dropdown wysunie się box z submenu, ale (jestem tego świadomy) wysuną się wszystkie boxy ponieważ klasa .dropdown występuje więcej niż raz. Dlatego mam pytanie, czy jakoś do tego kodu JS co podałem wyżej można dodać zasadę/regułę aby wysunęło box w momencie klikniecia tego jednego, wybranego .dropdown a nie wszystkich? Mogę sie posłużyć również ID ale w przypadku WP trzeba by było później zmieniać a chce tego uniknąć. Nie rozglądałem się za innymi propozycjami więc jak coś to mozecie również pokierować mnie na podobne rozwiązania ![]()
Problem rozwiązany, zmieniłem po prostu środkową linijkę dodając do niej (this)
$(this).children('.dropdown-menu').slideToggle(500);
A sądziłem, że będzie to bardziej skomplikowane ![]()
Jakby jednak był jakiś błąd to proszę o poprawne nakierowanie.














