oujood.com

Fenêtre Les méthodes moveTo(), moveBy(), resizeTo() et resizeBy()

Pour déplacer ou redimensionner une fenêtre vous pouvez utiliser les méthodes de l’objet window movTo, movBy, resizeTo et resizeBy
.....

chercher |

Définition et utilisation méthodes moveTo()

JavaScript cours tutorial

La méthode moveTo() déplace le bord gauche et le bord supérieure d'une fenêtre vers les coordonnées spécifiées.

moveTo (), comme le nom de la méthode l’indique, déplace une fenêtre sur les coordonnées indiquées par rapport à l'écran.

Méthodes connexes :

moveBy() - déplace une fenêtre par rapport à sa position actuelle

resizeBy() - se redimensionne la fenêtre en pixels spécifiés

resizeTo() - redimensionne la fenêtre à la largeur et la hauteur

Exemple Ouvrez une nouvelle fenêtre et déplacer la nouvelle fenêtre vers le coin supérieur gauche de l'écran :

Exemple :       Copier le code

  <!doctype html>
  <html lang="fr">
  <head>
           <meta charset="UTF-8">
           <title>Exemple la méthode movTO()</title>
  </head>
  <body>
    <p>Ouvrez « maFenetre » et déplace la nouvelle fenêtre
  vers le coordonnées données :</p>
   
  <button onclick="ouvreFenetre()">Ouvrir
  "maFenetre"</button>
  <button onclick="movFenetre()">Déplacer
  "maFenetre"</button>
   
  <script>
  var maFenetre;
   
  function ouvreFenetre()
  {
  maFenetre=window.open("","maFenetre","width=200,height=100");
  maFenetre.document.write("<p>Je suis
  'maFenetre'</p>");
  }
   
  function movFenetre()
  {
  maFenetre.moveTo(0,400);
  maFenetre.focus();
  }
  </script>
  </body>
  </html>

Appui de navigateur

Internet Explorer Firefox Opera Google Chrome Safari

La méthode moveTo() est prise en charge dans tous les principaux navigateurs.

Remarque : En spécifiant moveTo(0,0) à l'opéra, se traduit par déplacement de la fenêtre à l'angle supérieur gauche du navigateur, pas l'écran.

Syntaxe

window.moveTo(x,y)

Valeurs de paramètre

Parameter Description
x Required. A positive or negative number that specifies the horizontal coordinate to be moved to
y Required. A positive or negative number specifies the vertical coordinate to be moved to

Autre exemple : Ouvrir une fenêtre et la déplacer vers le centre

Exemple :       Copier le code

  <!doctype html>
  <html lang="fr">
  <head>
           <meta charset="UTF-8">
           <title>Exemple la méthodemovTo dépacer la fenêtre
  vers le centre de l'écran</title>
  </head>
  <body>
    <p>Ouvrez « maFenetre » et déplace la nouvelle fenêtre
  vers le coin supérieur gauche de l'écran :</p>
   
  <button onclick="ouvreFenetre()">Ouvrir
  "maFenetre"</button>
  <button onclick="movFenetre()">Déplacer "maFenetre" vers le
  centre</button>
   
  <script>
  var maFenetre;
   
  function ouvreFenetre()
  {
  maFenetre=window.open("","maFenetre","width=200,height=100");
  maFenetre.focus();
  maFenetre.document.write("<p>Je suis
  'maFenetre'</p>");
  }
   
  function movFenetre()
  {
  maFenetre.moveTo(screen.width/2-100, screen.height/2-50);
  maFenetre.focus();
  }
  </script>
  </body>
  </html>

Définition et utilisation méthode moveBy()

La méthode moveBy() déplace une fenêtre, un certain nombre de pixels par rapport à ses coordonnées actuelles.

Utilisez moveBy () pour déplacer une fenêtre horizontalement, verticalement ou les deux, selon la valeur spécifiée en pixels. A noter que la valeur du paramètre négative provoque la fenêtre pour être déplacé dans la direction opposée.

Exemple Ouvrez une nouvelle fenêtre et déplacez le nouveau 250px fenêtre par rapport à sa position actuelle :

Exemple :       Copier le code

  <!doctype html>
  <html lang="fr">
  <head>
           <meta charset="UTF-8">
           <title>Exemple la méthodemovTo dépacer la fenêtre
  par rapport à sa position actuelle</title>
  </head>
  <body>
    <p>Ouvrez « maFenetre » et déplacer la nouvelle fenêtre
  de 50 px par rapportà sa position actuelle :</p>
   
  <button onclick="ouvreFenetre()">Ouvrir
  "maFenetre"</button>
  <button onclick="movFenetre()">Déplacer
  "maFenetre"</button>
   
  <script>
  var maFenetre;
   
  function ouvreFenetre()
  {
  maFenetre=window.open("","maFenetre","width=200,height=100");
  maFenetre.document.write("<p>Je suis
  'maFenetre'</p>");
  maFenetre.focus();
  }
   
  function movFenetre()
  {
  maFenetre.moveBy(50,50);
  maFenetre.focus();
  }
  </script>
  </body>
  </html>

Appui de navigateur

Internet Explorer Firefox Opera Google Chrome Safari

La méthode moveBy() est prise en charge dans tous les principaux navigateurs.

Syntaxe

window.moveBy(x,y)

Valeurs de paramètre

Paramètre Description
x Obligatoire. Un nombre positif ou négatif qui spécifie le nombre de pixels pour déplacer la fenêtre horizontalement.
y Obligatoire. Un nombre positif ou négatif qui spécifie le nombre de pixels pour déplacer la fenêtre verticalement.

Définition et utilisation méthode resizeBy()

La méthode resizeBy() redimensionne une fenêtre selon la valeur spécifiée, par rapport à sa taille actuelle.

La méthode resizeBy() lasse le coin supérieur gauche de la fenêtre du navigateur en place, il déplace les autres coins si nécessaire.

Remarque : Cette méthode déplace le coin inférieur droit de la fenêtre par le nombre de pixels défini spécifié. Le coin supérieur gauche n'est pas déplacé (il reste dans ses coordonnées originales).

Exemple Ouvrez une nouvelle fenêtre et redimensionner la largeur et la hauteur 150px par rapport à sa position actuelle :

Exemple :       Copier le code

  <!doctype html>
  <html lang="fr">
  <head>
           <meta charset="UTF-8">
           <title>Exemple la méthodemovTo dépacer la fenêtre
  par rapport à sa position actuelle</title>
  </head>
  <body>
  <p>Ouvrir une nouvelle fenêtre et redimensionner la largeur
  et la hauteur de 150px :</p>
  <p><b>Astuce :</b> Cliuez le bouton «
  redimensionner » plusieurs fois (la fenêtre augmentera 150px pour
  chaque click).</p>
   
  <button onclick="ouvreFenetre()"> Ouvrir </button>
  <button onclick="resizeFenetre()"> redimensionner
  </button>
   
  <script>
  var maFenetre;
   
  function ouvreFenetre()
  {
  maFenetre = window.open("","", "width=100,height=100");
  }
   
  function resizeFenetre()
  {
  maFenetre.resizeBy(150,150);
  maFenetre.focus();
  }
  </script>
  </body>
  </html>

Appui de navigateur

Internet Explorer Firefox Opera Google Chrome Safari

La méthode resizeBy() est pris en charge dans tous les principaux navigateurs.

Syntaxe

resizeBy(width,height)

Valeurs de paramètre

Paramètre Description
width Obligatoire. Positif ou un nombre négatif qui spécifie le nombre de pixels pour redimensionner la largeur de
height Obligatoire. Positif ou un nombre négatif qui spécifie le nombre de pixels pour redimensionner la hauteur par

Définition et utilisation méthode resizeTo()

La méthode resizeTo() redimensionne la largeur et la hauteur de la fenêtre.

La méthode resizeTo laisse le coin supérieur gauche de la fenêtre du navigateur en place, il déplace les autres coins si nécessaires.

Exemple Ouvrez une nouvelle fenêtre et redimensionner la largeur et la hauteur de 250px :

Exemple :       Copier le code

  <!doctype html>
  <html lang="fr">
  <head>
           <meta charset="UTF-8">
           <title>Exemple la méthodemovTo dépacer la fenêtre
  par rapport à sa position actuelle</title>
  </head>
  <body>
  <p>Ouvrir une nouvelle fenêtre et redimensionner la largeur
  et la hauteur de 150px :</p>
   
  <button onclick="ouvreFenetre()"> Ouvrir </button>
  <button onclick="resizeFenetre()"> redimensionner
  </button>
  <script>
  var maFenetre;
   
  function ouvreFenetre()
  {
  maFenetre = window.open("","", "width=200,height=200");
  }
  function resizeFenetre()
  {
  maFenetre.resizeTo(350,350);
  maFenetre.focus();
  }
  </script>
  </body>
  </html>

Appui de navigateur

Internet Explorer Firefox Opera Google Chrome Safari

La méthode resizeTo() est pris en charge dans tous les principaux navigateurs.

Syntaxe

window.resizeTo(width,height)

Valeurs de paramètre

Paramètre Description
width Obligatoire. Définit la largeur de la fenêtre, en pixels
height Obligatoire. Définit la hauteur de la fenêtre, en pixels
Par carabde 30 mars 2014



Voir aussi nos tutoriel :

fonction addcslashes, addcslashes

Ajoute des slash dans une chaîne, la mode du langage C

padding-left

Définit la marge intérieure gauche d'un élément

Balise universelle div

Définit une section dans un document