Ouvrir un lien dans une nouvelle fenêtre avec l’attribut target
I. Présentation
Par défaut, les liens HTML s'ouvrent dans la fenêtre où l'on se situe lorsque l'on clic dessus. Cela peut être gênant car on peut perdre notre page source et voir notre navigation perturbée ou, en tant que web-master, voir nos visiteurs s'enfuir . Pour cela, il existe l'attribut "target" à mettre dans la balise de lien "<a href>". Il faut néanmoins savoir que Googe juge pertinent l'utilisation de cet attribut uniquement s'il s'agit d'un lien qui faire sortir l'utilisateur du site (qui mène vers un autre site) , nous allons donc voir comment faire et comment effectuer la même chose de façon différente avec du JavaScript.
II. Utilisation de l'attribut "target"
On suppose que notre lien mène vers la page "index2.html" et que, par défaut, il ressemble à cela :
<a href="index2.html">Index 2</a>
Avec ce code, l'utilisateur ouvrira la page "index2.html" dans la même fenêtre que la page où il se situ, perdant ainsi cette page. Pour que l’ouverture se fasse dans une nouvelle fenêtre (nouvel onglet), on écrira notre lien comme suivant :
<a href="index2.html" target="_blank">Index 2</a>
On précise en effet que la cible du lien est une nouvelle fenêtre et non celle où le visiteur se situ actuellement.
III. Utilisation du javascript
Le JavaScript pour effectuer la même action sans l'attribut HTML "target" :
<a href="index2.html" onclick="window.open(this.href);return false">Index 2</a>
Nous avons maintenant le même effet avec l'action "onclick" qui ouvre une fenêtre qui contiendra " href" autrement dit le lien indiqué "index2.html".
Bonjour, merci pour ces codes mais connaissez vous le moyen d’ouvrir une petite fenêtre dans une grande fenêtre svp ?
Pour m’expliquer plus clairement, voici un exemple de ce que je cherche à faire : http://www.ingridliman.fr/galerie
Merci !
Bonjour,
Vous parlez de la fenêtre qui s’ouvre lorsque l’on clic sur une photo ? Regardez du côté de l’outil Fancybox, qui s’appuie sur la librairie jQuery.
Bon courage !
Florian
merci pr ces infos
génial
merci bien pour ces codes