popup et div centrées

Version imprimable

Bonjour,

J'ai un script qui sert doublement à ouvrir une popup centrée, ainsi que de centrer une div. Ceci quelquesoit la résolution.
Ça marche très bien sous IE, mais pas sous OPERA.
Sous firefox, je ne sais pas, je ne l'ai pas...
Pouvez-vous me dire pourquoi...?

Merci.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<html> 
<head>
<script type="text/javascript">
var centre = null;
var posX = null;
var posY = null;
var larg = 70;
var haut = 60;
larg = Math.ceil(screen.availWidth * (larg/100)*(1024/screen.width));
haut = Math.ceil(screen.height * (haut/100));
posX=Math.ceil((screen.availwidth - larg)/2);
posY=Math.ceil((screen.avalHeight - haut)/2)-50;
function ow(theURL,larg0,haut0) {
//----ça c'est le calcul de la position centrale de la fenetre---->
larg0 = Math.ceil(screen.availWidth * (larg0/100)*(1024/screen.width));
haut0 = Math.ceil(screen.availHeight * (haut0/100));
posX0=Math.ceil((screen.width - larg0)/2);
posY0=Math.ceil((screen.height - haut0)/2);
//------------------------- on ouvre centre  ------------------------------->
			centre = window.open(theURL,"inf2","scrollbars=yes,menubar=yes,location=yes,resizable=yes,width="+ larg0 +",height="+ haut0 +",top="+posY0+"px,left="+posX0+"px");
			centre.focus();
}
</script> 
<head>
<body>
<div><a href="#" onClick="ow('http://www.developpez.net/',60,50);">http://www.developpez.net/</a></div>
<script type="text/javascript">
document.write("<div style='position:absolute;width:"+larg+";height:"+haut+";top:"+posY+";left:"+posX+";border:1px solid black;padding:5px'>div 1</div>");
</script>
</body>
</html>

Fort possible que ce soit dû à l'écriture du style en js.

30/07/2007, 16h01
E.Bzz

Bonjour,
essaye en ajoutant l'unité pour les coordonnées (top et left) et les tailles (height et width)

Code:

"...width:"+larg+"px;..."

A+
30/07/2007, 16h21
Tdeny

Merci, mais non, ça ne marche pas.
30/07/2007, 16h37
E.Bzz
Mets ton div directement en HTML (sans faire de document.write() ).
Tu lui attributs un ID et tu pourras ensuite modifier les caractéristiques en dynamique
Code:

1 2 document.getElementById('id_du_div').style.width = larg+"px"; ...
A+
30/07/2007, 16h37
Tdeny

J'ai trouvé...
C'est intéressant à savoir.
Ça marche quand on remplace les availWidth et availHeight par width et height tout court.
Apparemment Opera ne connait pas, ou l'a supprimé l'availWidth et le prend par défaut dans le width.
J'ai mis -100 pour la position de la div et -50 pour la popup.[
CODE]<html>
<head>
<script type="text/javascript">
var centre = null;
var posX;
var posY;
var larg = 70;
var haut = 60;
larg = Math.ceil(screen.width * (larg/100)*(1024/screen.width));
haut = Math.ceil(screen.height * (haut/100));
posX=Math.ceil((screen.width - larg)/2);
posY=Math.ceil((screen.height - haut)/2)-100;
function ow(theURL,larg0,haut0) {
//----ça c'est le calcul de la position centrale de la fenetre---->
larg0 = Math.ceil(screen.width * (larg0/100)*(1024/screen.width));
haut0 = Math.ceil(screen.height * (haut0/100))-100;
posX0=Math.ceil((screen.width - larg0)/2);
posY0=Math.ceil((screen.height - haut0)/2)-50;
//------------------------- on ouvre centre ------------------------------->
centre = window.open(theURL,"inf2","scrollbars=yes,menubar=yes,location=yes,resizable=yes,width="+larg0+"px,height="+haut0+"px,top="+posY0+"px,left="+posX0+"px");
centre.focus();
}
</script>
<head>
<body>
<div><a href="#" onClick="ow('http://www.developpez.net/',60,50);">http://www.developpez.net/</a></div>
<script type="text/javascript">
document.write("<div style='position:absolute;width:"+larg+"px;height:"+haut+"px;top:"+posY+"px;left:"+posX+"px;border:1px solid black;padding:5px'>div 1</div>");
</script>
</body>
</html>
[/CODE]