laadbalk 2

JavaScripts knippen en plakken

Op deze website vind je javascripts die je door eenvoudig knippen en plakken aan jouw site kunt toevoegen.

Home CSS DHTML Forum E-mail Sitezoeker Links

LAADBALK 2

0 %

Onderstaande knoppen maken geen deel uit van de laadbalk, ze dienen enkel om de werking ervan te kunnen testen.
1. Kopieer deze code en plaats ze in het HEAD-gedeelte van je pagina :

var progressie,balk_ag,balk_vg,balk_tekst,balk_breedte;
var eenheid = 100;	// 100 = vordering met 1%, 50 = vordering met 2%, ...  
var huidigePositie = 0;
	
function wijzigBalk(stap) {

if(!balk_ag) {
progressie   = document.getElementById('progressie');
balk_ag      = document.getElementById('balk_ag');
balk_vg      = document.getElementById('balk_vg');
balk_tekst   = document.getElementById('balk_tekst');
balk_breedte = balk_ag.clientWidth;}

huidigePositie+= stap;
if (huidigePositie > eenheid) huidigePositie = eenheid;

var width = Math.ceil(balk_breedte * (huidigePositie / eenheid));
balk_vg.style.width = width + 'px';

var procent = Math.ceil((huidigePositie / eenheid) *100);
balk_tekst.innerHTML = procent + '%';

// laat de balk verdwijnen indien 100% bereikt:
if (huidigePositie==eenheid) {
setTimeout('document.getElementById("progressie").style.display="none"',50);

/* Om een url op te geven van de te tonen pagina nadat de balk 100% bereikt heeft,
de // hieronder weghalen en de naam van de pagina invullen                      */

// window.location.href="doelpagina.htm"
}
}
	
/* Om de waarde te verhogen, de functie wijzigBalk() aanroepen 
Bijvoorbeeld: wijzigBalk(1) om met 1 stap te verhogen          
Of gebruik onderstaande automatische functie:                */

function auto() {
if(huidigePositie < eenheid) {
wijzigBalk(1);
setTimeout('auto()',100);}}

/* Om de balk automatisch te laten starten bij het inladen van het document 
   de // hieronder weghalen:                                              */
   
// window.onload=auto;
</script>

2. Kopieer deze code en plaats ze in het BODY-gedeelte van je pagina : 3. Instructies:

Normaal gezien laat je de laadbalk automatisch opstarten bij het inladen van de pagina.
Je kunt ze echter op verschillende manieren en voor allerlei doeleinden gebruiken.
De nodige instructies staan in het script aangegeven.

Copyright: Het internet is van iedereen, de volledige inhoud van deze site kan door iedereen vrij gebruikt worden.