Show og hide HTML-elementer

Beskrivelse af Show / Hide

Særligt for 'hide* og 'show' er det, at elementet vises / skjules med udgangspunkt i enten øverste venstre eller højre hjørne af den omgivende container

'hide' og 'show' animerer på både elementets bredde og højde samtidig
animationen tager udganspunkt i den omgivende containers øverste venstre eller højre hjørne
'hide' og 'show' animerer med en default hastighed på 400 ms
hastigheden kan justeres med en ord- eller tal-værdi

hide

Skjul elementet ved at klikke:

$('.box').click(function() { 	
	$(this).hide(); 
});

'hide' bruges kun på synlige elementer
animationen har udgangspunkt i øverste venstre hjørne af den omgivende container

show

Vis elementet ved at klikke på knappen - udgangspunktet er øverste højre hjørne på grund af 'float: right':

$('button').click(function() { 	
	$('.box').show('slow'); 
});

.box {
    float: right;
    display: none;
}

'show' bruges kun på skjulte elementer
med float: right har animationen udgangspunkt i øverste højre hjørne af den omgivende container

toggle mellem hide og show

Skift mellem skjult tilstand og synlighed vad at klikke på knappen:

SKJUL

$('button').click(function() { 	
	$('.box').toggle(); 
});