Lorsque vous voulez manipuler vos pubs par exemple ouvrir une fenêtre affichant une pub en plus de la cible classique d’un lien, il existe une petite astuce javascript pour le réaliser. Cette astuce peut être utilisée dans d’autres cas qui nécessitent l’ouverture de deux cibles via un seul lien.
Partons de cette page simple HTML avec un lien classique :
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>Lien avec double cible</title>
</head>
<body>
<a href="https://google.fr">Ouvrir deux cibles</a>
</body>
</html>
Nous allons créer une simple fonction javascript qui ouvre une fenêtre et mettre ce script avant de fermer le <body>:
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>Lien avec double cible</title>
</head>
<body>
<a href="https://google.fr">Ouvrir deux cibles</a>
<script type="text/javascript">
function openlink(){
window.open("https://lookmandesign.net", "", "toolbar=1");
}
</script>
</body>
</html>
Ensuite, nous allons simplement ajouter un événement onClick sur le lien afin d’exécuter la fonction. Ainsi, en plus d’ouvrir le lien contenu dans l’attribut href, le clic va exécuter la fonction qui elle va aussi ouvrir une nouvelle fenêtre avec pour adresse le premier argument (qui peut être aussi vide si vous voulez une fenêtre vide).
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>Lien avec double cible</title>
</head>
<body>
<a href="https://google.fr" onClick="openlink()">Ouvrir deux cibles</a>
<script type="text/javascript">
function openlink(){
window.open("https://lookmandesign.net", "", "toolbar=1");
}
</script>
</body>
</html>
On pouvait aussi se passer de la fonction et écrire directement dans l’événement onClick comme ceci :
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>Lien avec double cible</title>
</head>
<body>
<a href="https://google.fr" onClick='window.open("https://lookmandesign.net", "", "toolbar=1")'>Ouvrir deux cibles</a>
</body>
</html>