PHPhulp.nl PHPhulp.nl
35k+ leden Over PHPhulp Offerte opdracht Contact
O

jQuery help

Door Onbekend Onbekend op 19-10-2008 13:45
1.356 views
Ik gebruik jQuery en daar wil ik bij blijven.

Ik heb een probleem. Ik weet niet hoe ik iets moet aanpakken:
Als ik een header heb en daar op geklikt wordt, moet het content eronder verdwijnen.


<h1 id="page-settings-toggle" class="showhide hidden"><span class="arrow-showhide"><!-- --></span> <span class="icon wrench-icon"><!-- --></span> <img src="i/text/paginainstellingen.png" alt="Pagina instellingen" /></h1>
<div id="page-settings" class="hidden"><!-- deze div moet shown krijgen en de h1 ook en als de class shown is, moeten ze hidden krijgen -->


Ik weet dat je met $(".showhide").bind("click", function bla bla dat kunt beginnen, maar hoe moet ik verder. Hoe kan ik zorgen dat met Javascript bij onclick op de h1 (bijv page-settings-toggle) dat -toggle er af wordt geknipt en dan de div page-settings van class wordt veranderdt?

Thx. Thomas
A
Arend a
21-10-2008 17:15
Maar je hebt in je code daar geen jquery code staan? Alleen onderaan een stukje dat weggecomment is. Dat schiet niet op natuurlijk.
N
Niek Weevers
21-10-2008 21:31
Je moet wel altijd eerst je jquery javascript inladen voor je script begint
A
Arend a
22-10-2008 00:14
laat maar, ik ga niet 500 regels code doorspitten
O
Onbekend Onbekend
22-10-2008 15:37
Haha, die eerst 5000 regels zijn van jQuery en de laatste 4 ofzo van mij:
function init() {
	$(".showhide-parent h1").bind("click", function () { alert($(this).parent().toggleClass("hidden"); } );
}

$(document).ready(init());


Das al m'n code ;)
O
Onbekend Onbekend
22-10-2008 18:55
$(".showhide").bind("click", function () { $(this.parentNode).toggleClass("hidden"); } );

Dat werkt niet maar geeft ook geen error.
N
Niek Weevers
22-10-2008 20:48
Probeer het volgende eens.

$(".showhide-parrent>div").hide();
		
$(".showhide-parrent h1").click(
function()
{
	$("div", this.parentNode).toggle(200);
});

Let op!
Je hebt twee keer id="poll". In de div van het hele blok en in de div van het blok onder de titel. Dit mag niet. Eenmaal een id gebruiken.
Ik zie in de code .showhide-parrent, terwijl je in dit forum .showhide-parent (met één r) gebruikt.
Ik gebruik in de bovenstaande code $(".showhide-parrent>div").hide();
Dit doe ik omdat je dan de blokken met behulp van javascript eerst verbergt. Als je ze al standaard verbergt met bijv css, dan kan een bezoeker die javascript heeft uitstaan de blokken nooit bekijken. Wanneer je in bovenstaand geval javascript hebt uitstaan, dan zijn de volledige blokken zichtbaar.
O
Onbekend Onbekend
22-10-2008 21:15
Ja online staat nog een oude versie. Als ik zo kijk, doet dat niet echt wat ik wil, of iig snap ik het niet zo goed. .click werkt net zo goed als .bind? Mss dat het daar aan licht.
N
Niek Weevers
22-10-2008 23:45
Wat precies het verschil is, durf ik zo niet te zeggen. Maar mijn idee moet ook werken lijkt me.
de div in showhide-parent is verborgen. Door te clicken op de h1 toon je hem, door weer te klikken verberg je hem weer, enz. Dat is wat toggle doet.
Is hier ook toegepast

Reageren

Inloggen om te reageren