Comment centrer l'ouverture d'un popup svp ?

Comment centrer l'ouverture d'un popup svp ? - HTML/CSS - Programmation

Marsh Posté le 22-11-2007 à 19:44:44    

Bonjour,
 
Voilà j'ai récupéré ce code pour l'ouverture de mes images en popup :
 
Dans les HEAD
 

Code :
  1. <SCRIPT LANGUAGE="JavaScript">
  2. <!--
  3. function PopupImage(img) {
  4. titre="IMAGES";
  5. w=open("",'image','width=800,height=640,toolbar=no,scrollbars=no,resizable=no');
  6. w.document.write("<HTML><HEAD><TITLE>"+titre+"</TITLE></HEAD>" );
  7. w.document.write("<SCRIPT language=javascript>function checksize() { if (document.images[0].complete) { window.resizeTo(document.images[0].width+10,document.images[0].height+30); window.focus();} else { setTimeout('checksize()',250) } }</"+"SCRIPT>" );
  8. w.document.write("<BODY onload='checksize()' onblur='window.close()' onclick='window.close()' leftMargin=0 topMargin=0 marginwidth=0 marginheight=0>" );
  9. w.document.write("<TABLE width='100%' border='0' cellspacing='0' cellpadding='0' height='100%'><TR>" );
  10. w.document.write("<TD valign='middle' align='center'><IMG src='"+img+"' border=0 alt='Mon image'>" );
  11. w.document.write("</TD></TR></TABLE>" );
  12. w.document.write("</BODY></HTML>" );
  13. w.document.close();
  14. }
  15. //-->
  16. </SCRIPT>


 
 
Et pour le lien
 

Code :
  1. <a href="javascript:PopupImage('images/totb.jpg')"><img src="images/tots.jpg" width="425" height="340" border="0" classe="image" alt="Cliquer pour agrandire"></a>


 
 
Et avec sa je suis contant mon image en grand s'ouvre bien.
 
 
 
J'ai bien trouvé divers code Javascript pour centrer le popup qui s'ouvre, mais si j'intègre ce code dans celui-ci cela ne marche plus :(
 
Auriez-vous la gentillesse svp de m'indiquer le code précis et ou l'insérer pour que cela marche ?
 
 
Merci d'avance pour votre aide.
 
Bonne journée.

Reply

Marsh Posté le 22-11-2007 à 19:44:44   

Reply

Marsh Posté le 23-11-2007 à 13:09:51    

Un ptit UP svp tjrs d'actualité

Reply

Marsh Posté le 23-11-2007 à 13:46:48    

insère ca :

Code :
  1. <SCRIPT language=javascript>
  2. var centerWindow = function (win)
  3. {
  4.   var w, h;
  5.   if (win.innerHeight) // all except Explorer
  6.   {
  7. w = win.innerWidth;
  8. h = win.innerHeight;
  9.   }
  10.   else if (document.documentElement && document.documentElement.clientHeight)
  11.   {
  12. w = document.documentElement.clientWidth;
  13. h = document.documentElement.clientHeight;
  14.   }
  15.   else if (document.body)
  16.   {
  17. w = document.body.clientWidth;
  18. h = document.body.clientHeight;
  19.   }
  21.   var sx = screen.width, sy = screen.height;
  22.   win.moveTo (parseInt ((sx - w) / 2), parseInt ((sy - h) / 2));
  23.   return true;
  24. }
  26. function checksize() {
  27. ......
  28. ......
  29. }


 
et dans tu places ensuite ca : centerWindow (w);
devant le window.focus();


Message édité par SICKofitALL le 23-11-2007 à 13:47:00

---------------
We deserve everything that's coming...
Reply

Marsh Posté le 23-11-2007 à 14:03:15    

Hello Sick,
 
Tout dabord merci d'avoir pris le temps de me répondre !
 
 
Par contre la je suis un peut perdu dans ton script :(
 
Si je comprend bien je laisse le mien comme il est et j'insère dans mon HEAD le tient ? Bien sur en rajoutant en ligne 30 </SCRIPT>
 
Et pour ton : et dans tu places ensuite ca : centerWindow (w);
devant le window.focus();
 
Je vois pas du tout ou le mettre, je ne vois pas cette fonction :(
 
 
Merci d'avance pour tes précisions !
 
Bonne journée.

Reply

Marsh Posté le 23-11-2007 à 14:10:49    

tu devrais mieux lire tes sources ;)
parce que en fait des scripts comme celui-ci il en existe des tonnes, et si ils ne marchent pas, c'est que tu les as mal implémenté :)

 

Donc résumons, jte fais un big bout de code (en reprenant le tiens) avec une petite modif par rapport à ce que je t'ai sorti plus, dans un soucis de clarté :

Code :
  1. <SCRIPT LANGUAGE="JavaScript">
  2. <!--
  3. /* fonction qui centre une fenetre passée en parametre */
  4. var centerWindow = function (win)
  5. {
  6.   var w, h;
  7.   if (win.innerHeight)
  8.   {
  9. w = win.innerWidth;
  10. h = win.innerHeight;
  11.   }
  12.   else if (document.documentElement && document.documentElement.clientHeight)
  13.   {
  14. w = document.documentElement.clientWidth;
  15. h = document.documentElement.clientHeight;
  16.   }
  17.   else if (document.body)
  18.   {
  19. w = document.body.clientWidth;
  20. h = document.body.clientHeight;
  21.   }
  22.   var sx = screen.width, sy = screen.height;
  23.   win.moveTo (parseInt ((sx - w) / 2), parseInt ((sy - h) / 2));
  24.   return true;
  25. }
  27. function PopupImage(img) {
  28. titre="IMAGES";
  29. w=open("",'image','width=800,height=640,toolbar=no,scrollbars=no,resizable=no');
  30. w.document.write("<HTML><HEAD><TITLE>"+titre+"</TITLE></HEAD>" );
  31. w.document.write("<SCRIPT language=javascript>function checksize() { if (document.images[0].complete) { window.resizeTo(document.images[0].width+10,document.images[0].height+30); window.opener.centerWindow (window); window.focus();} else { setTimeout('checksize()',250) } }</"+"SCRIPT>" );
  32. w.document.write("<BODY onload='checksize()' onblur='window.close()' onclick='window.close()' leftMargin=0 topMargin=0 marginwidth=0 marginheight=0>" );
  33. w.document.write("<TABLE width='100%' border='0' cellspacing='0' cellpadding='0' height='100%'><TR>" );
  34. w.document.write("<TD valign='middle' align='center'><IMG src='"+img+"' border=0 alt='Mon image'>" );
  35. w.document.write("</TD></TR></TABLE>" );
  36. w.document.write("</BODY></HTML>" );
  37. w.document.close();
  38. }
  39. //-->
  40. </SCRIPT>
 

(en gras la chtite modif dans le popup)
ca devrait fonctionner je pense :)


Message édité par SICKofitALL le 23-11-2007 à 14:12:18

---------------
We deserve everything that's coming...
Reply

Marsh Posté le 23-11-2007 à 14:23:15    

Je ne suis pas scripteur mais purement passionné c'est pour cela que je viens sur des forum pour demander de l'aide ;) Et le script de base marche nickel j'ai bien pu l'implanter mais pas la fonction de centrage ^^
 
Merci pour ton aide et là c'est effectivement bcp plus clair.
 
 
Par contre sa marche pas :( autant sous IE que sous FF :(

Reply

Marsh Posté le 23-11-2007 à 14:27:57    

ah bon ??
je check


---------------
We deserve everything that's coming...
Reply

Marsh Posté le 23-11-2007 à 14:32:45    

heu écoute viens de copier/colle le code plus haut, l'insérer avec comme seul code HTML ceci :
<a href="#" onclick="PopupImage ('cover1.jpg')"><img src="cover1.jpg"></a>
 
et ca fonctionne sans soucis, centrage y compris :/
 
Donc à part "ca marche pas", tu as plus de détails ?


---------------
We deserve everything that's coming...
Reply

Marsh Posté le 23-11-2007 à 14:41:18    

Ben c'est bizzard, car sous mes deux explorer, la fenêtre s'ouvre bien sa c'est ok, mais elle n'est pas centré sur mon écran (24" ) elle est décallée contre la droite par rapport au centre.
 
Je recopie/colle le code.

Reply

Marsh Posté le 23-11-2007 à 15:06:14    

Heu vraiment bizzard quand je test offline sa marche pas ... mais là je viens de up la page sur mon hébergeur et sa marche !
 
Halalala les joies de l'informatique ;)
 
Encore merci pour ton aide !

Reply

Marsh Posté le 23-11-2007 à 15:06:14   

Reply

Marsh Posté le 23-11-2007 à 15:37:52    

Ta page était surement en cache : en gros pour éviter de trop charger il garde en mémoire les pages plutôt que de les recharger à chaque coup. Généralement ctrl+f5 permet de recharger la page intégralement. ;)

Reply

Marsh Posté le 23-11-2007 à 15:50:54    

Je pense plutôt qu'il a testé la page en local et que du coup IE a bloqué le JS.


---------------
-- Debian -- Le système d'exploitation universel | Le gras c'est la vie! | /(bb|[^b]{2})/
Reply

Marsh Posté le 23-11-2007 à 16:06:59    

Ha tient je connaissait le F5 mais le CTRL+F5 pour tout recharger sa pas, merci pour l'info !
 
Et oui j'ai remarqué qu'en local IE me bloc bcp de chose alors que par online pas ...

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed