Vervang de body-tag door het exemplaar wat hieronder staat, en plaats het javascript zo laag als mogelijk in de body-sectie van de pagina. Het resultaat heb je (als tenminste jouw javascript stond ingeschakeld) bij het openen van de pagina al kunnen zien.
<body id="spinner_id" onload="page_spinner();">
<script>
var de_css_code = "#spinner_id{position:absolute;position:relative;width:100%;}",
stijl_element = document.createElement("style");
stijl_element.type = "text/css";
if (stijl_element.styleSheet) {
stijl_element.styleSheet.cssText = de_css_code;
} else {
stijl_element.appendChild(document.createTextNode(de_css_code));
}
document.getElementsByTagName("head")[0].appendChild(stijl_element);
var de_snelheid = 20;
var aantal_graden = 180,
doen,
de_radius,
de_cosinus,
de_sinus,
m11,
m12,
m21,
m22,
plaatje,
graden_naar_radius = Math.PI * 2 / 360;
var richting = 1;
function pagina_spinner() {
if (aantal_graden > 359) {
aantal_graden = 0;
richting = 14;
}
if (richting == 1) {
aantal_graden = aantal_graden + 10;
}
de_radius = aantal_graden * graden_naar_radius;
de_cosinus = Math.cos(de_radius);
de_sinus = Math.sin(de_radius);
m11 = parseFloat(de_cosinus).toFixed(8);
m12 = parseFloat( - de_sinus).toFixed(8);
m21 = parseFloat(de_sinus).toFixed(8);
m22 = parseFloat(de_cosinus).toFixed(8);
if (richting == 14) {
clearTimeout(doen);
plaatje.style.filter = "progid:DXImageTransform.Microsoft.Matrix(Enabled = false)";
document.getElementById('spinner_id').style.MozTransform = '';
document.getElementById('spinner_id').style.webkitTransform = '';
document.getElementById('spinner_id').style.OTransform = '';
document.getElementById('spinner_id').style.width = 98.9 + "%";
document.getElementById('spinner_id').style.marginTop = 0;
return;
} else {
plaatje.style.filter = "progid:DXImageTransform.Microsoft.Matrix(M11=" + m11 +
",M12=" + m12 + ",M21=" + m21 + ",M22=" + m22 + ",sizingMethod='auto expand');";
document.getElementById('spinner_id').style.MozTransform = 'rotate(' + aantal_graden + 'deg) ';
document.getElementById('spinner_id').style.webkitTransform = 'rotate(' + aantal_graden + 'deg) ';
document.getElementById('spinner_id').style.OTransform = 'rotate(' + aantal_graden + 'deg) ';
doen = setTimeout(function() {
pagina_spinner();
},
de_snelheid);
}
}
function page_spinner() {
if (document.getElementById) {
plaatje = document.getElementById("spinner_id");
pagina_spinner();
}
}
</script>