[JavaScript] [FF 3.6] Centrer une DIV au centre de l'écran

[transgohan]

J'avais comme problématique de centrer une DIV au centre de l'écran en position absolute.
Seul problème je n'ai trouvé aucun script permettant de gérer les cas où la page aurait eu un scroll.
Je suis finalement tombé au bout d'un bon moment de recherche sur ce script que j'ai légèrement modifié pour le rendre plus utilisable (passage de l'id et rajout de commentaires).

Code javascript :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
/*
* putInCenter : Centre un élément au milieu de l'écran et le fixe en position:absolute
* @param (String) ID de l'élément
* @return (void)
*/
function putInCenter(id) { 
	// Récupération de la taille de la portion de fenêtre affichée
	var d = document; 
	var rootElm = (d.documentElement && d.compatMode == 'CSS1Compat') ? d.documentElement : d.body; 
	var vpw = self.innerWidth ? self.innerWidth : rootElm.clientWidth;  
	var vph = self.innerHeight ? self.innerHeight : rootElm.clientHeight; 
	// Récupération de la div à centrer
	var myDiv = d.getElementById(id); 
	if( myDiv != null )
	{
		// On fixe la div en position absolute
		myDiv.style.position = 'absolute'; 
		// On lui fixe sa position à partir du bord gauche et haut de l'écran
		// en prenant pour point centré le centre de la div
		myDiv.style.left = ( (vpw / 2) - (myDiv.offsetWidth / 2) ) + 'px';  
		myDiv.style.top = ( rootElm.scrollTop + (vph / 2) - (myDiv.offsetHeight / 2) ) + 'px'; 
	}
}

N'ayant pas de nécessité de compatibilité entre navigateur je ne l'ai pas testé sous un autre navigateur que Firefox.