Maison > interface Web > tutoriel CSS > le corps du texte

Comment ouvrir de nouvelles fenêtres avec des dimensions et des fonctionnalités spécifiques à l'aide de HTML et JavaScript ?

Linda Hamilton
Libérer: 2024-10-26 11:12:02
original
944 Les gens l'ont consulté

How to Open New Windows with Specific Dimensions and Features Using HTML and JavaScript?

Ouverture d'une nouvelle fenêtre en HTML à l'aide de Target="_blank"

En HTML, l'attribut target="_blank" indique au navigateur d'ouvrir une nouvelle fenêtre lorsqu'un lien est cliqué. Cependant, cet attribut ne permet pas de contrôler la taille ou l'emplacement de la nouvelle fenêtre.

Par exemple, considérons le code suivant :

<code class="html"><a href="facebook.com/sharer" target="_blank">Share this</a></code>
Copier après la connexion

Dans Firefox, ce code ouvrira le Facebook partager la page dans un nouvel onglet au lieu d’une nouvelle fenêtre. Pour obtenir le comportement souhaité, vous pouvez utiliser JavaScript pour créer et personnaliser une nouvelle fenêtre.

Solution :

Pour ouvrir un lien dans une nouvelle fenêtre avec des dimensions spécifiques lorsque cliqué, vous pouvez utiliser le code suivant :

<code class="html"><a href="http://www.facebook.com/sharer" onclick="window.open(this.href, 'mywin', 'left=20,top=20,width=500,height=500,toolbar=1,resizable=0'); return false;">Share this</a></code>
Copier après la connexion

Voici ce que fait chaque paramètre de la fonction window.open() :

  • this.href : L'URL de la page à ouvrir.
  • 'mywin' : Le nom de la nouvelle fenêtre.
  • 'left=20,top=20' : La position gauche et supérieure de la fenêtre.
  • 'width=500,height=500' : La largeur et la hauteur de la fenêtre.
  • 'toolbar=1' : Indique si une barre d'outils doit être affichée.
  • 'resizing=0' : Indique si la fenêtre peut être redimensionnée.

En utilisant cette approche, vous pouvez ouvrir une nouvelle fenêtre avec les dimensions et les options de personnalisation souhaitées lorsqu'un lien avec target="_blank" est cliqué.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!