Forum PHP.pl

Napisałem sobie prostą listę kategorii: (czy kategorie powinny być na <li> ?)

[HTML] pobierz, plaintext 
<div class="item"><a href="#" title="" data-id="1">1</a></div>
<div class="item"><a href="#" title="" data-id="2">2</a></div>
[HTML] pobierz, plaintext 

chce osiągnąć taki efekt, że po kliknięciu na kategorię pokaże się lista subkategorii do TEJ kategorii, dlatego dodałem znaczniki data.

Później mam listę subkategorii:

[HTML] pobierz, plaintext 
<div class="subcategories-list" data-subcategory="1" style="display: none;">
 
	aaaaaaaaaaaaa
 
</div>
[HTML] pobierz, plaintext 

No i chcę żeby działało:

[HTML] pobierz, plaintext 
$('.maincategories a').click(function(){
			var clicked = $(this).data("id");
			$('.subcategories-list[data-subcategory="'+clicked+'"]').show();
		});
[HTML] pobierz, plaintext 

i działa... rozwija mi listę subkategorii z tym że nie chowa poprzedniej. Jak to zrobić?

Ten post edytował Czikusek 2.08.2018, 12:32:36

A dlaczego miałoby chować?
Przy kliknięciu najpierw schowaj wszystkie.

A jak schować wszystkie? wrzuciłem je w diva .subcategories i w jquery dałem $('.subcategories').hide(); i nie trybi. Nawet wtedy nie pokazuje klikniętej kategorii.

Próbuje zrobić taki efekt jak jest na sprzedajemy.pl

O jezu... dobra nie było tematu

To zapytam teraz tak. Mam 4 kategorie w rzędzie:

[kategoria1] [kategoria2] [kategoria3] [kategoria4]
--- tu chciałbym pokazać subkategorie do powyższych
[kategoria5] [kategoria6] [kategoria7] [kategoria8]
--- tu chciałbym pokazać subkategorie do powyższych

Jak to zrobić? nie mam pomysłu

No właśnie tylko że, mam te kategorie główne

[PHP] pobierz, plaintext 
<div class="item"><a href="#" title="" data-id="1">1</a></div>
<div class="item"><a href="#" title="" data-id="2">2</a></div>
<div class="item"><a href="#" title="" data-id="3">3</a></div>
<div class="item"><a href="#" title="" data-id="4">4</a></div>
<div class="item"><a href="#" title="" data-id="5">5</a></div>
<div class="item"><a href="#" title="" data-id="6">6</a></div>
<div class="item"><a href="#" title="" data-id="7">7</a></div>
<div class="item"><a href="#" title="" data-id="8">8</a></div>
[PHP] pobierz, plaintext 

A pod spodem subkategorie. Jak teraz wrzucić pod kategorie 1-4 subkategorie jeśłi sie na nie kliknie?

I dodatkowo jak po kliknięciu jeszcze raz w tą samą kategorie ją schować? bo teraz kliknie - otwiera się, ale jak znowu kliknę to już sie nie chowa.

Ten post edytował Czikusek 2.08.2018, 13:06:05

To jak klikniesz raz to ma się pokazać subkategoria. Jak klikniesz drugi raz to ma się schować. Teraz się nie chowa. Chodzi mi o efekt toggle (dosłownie)

To dałem toggle() i nie działa. Otwiera, ale już nie zamyka po ponownym kliknięciu. Więc? Wszystko przez to hide(). Jak to pogodzić ze sobą?

[PHP] pobierz, plaintext 
$(document).ready(function(){
 
		$('.maincategories a').click(function(){
			$('.subcategories-list').hide();
			var clicked = $(this).data("id");
			$('.subcategories-list[data-subcategory="'+clicked+'"]').toggle();
		});
 
 
	});
[PHP] pobierz, plaintext 

I tak jak pisałem... nie działa zwinięcie