ugrás a tartalomhoz

Archívum - Nov 25, 2011 - Fórum téma

CHECKBOX kipipálásra legördülő lista

attiss94 · 2011. Nov. 25. (P), 21.27
Sziasztok!
Rengeteget Google-ztam mielőtt feltettem a kérdést. Jelenleg szeretnék csinálni egy programot, ami abból áll, hogy van egy CHECKBOX "listám" (egymás alatt jelennek meg) tegyük fel, hogy így:

□ Gabona
□ Zöldség
□ Gyümölcs.

Ha bepipálom a Gabona előtti CHECKBOX-ot, akkor gördüljön le egy lista és tolja le a többi elemet így:

■ Gabona
- Búza
- Zab
□ Zöldség
□ Gyümölcs.

Addig eljutottam, hogy sikerült kipipálástól függően eltüntetni/megjeleníteni az elemeket, de hogyan tudom megcsinálni, hogy ne legyen alattuk az a hely, ami az eltüntetett elemeknek szükséges, hanem kipipáláskor csússzon le?

Javasript:

function rejtes(chkbox, group)
	{ 
		var visSetting = (chkbox.checked) ? "visible" : "hidden"; 
		document.getElementById(group).style.visibility = visSetting; 
	}
CSS:

#rejtett
	{
		visibility:hidden;
	}
	
#rejtett1
	{
		visibility:hidden;
	}
HTML:

<input type="checkbox" name="gabona" onclick="rejtes(this, 'rejtett')" /> Gabona
<span id="rejtett">
	<li><input type="checkbox" />Búza</li>
	<li><input type="checkbox" />Rizs</li>
	<li><input type="checkbox" />Korpa</li>
	<li><input type="checkbox" />Árpa</li>
</span>
<input type="checkbox" name="zoldseg" onclick="rejtes(this, 'rejtett1')" /> Zöldség
<span id="rejtett1">
	<li><input type="checkbox" />Répa</li>
	<li><input type="checkbox" />Krumpli</li>
</span>