changer une class avec un lien d'une autre page

[Gael22230]

Bonjour
Il y a peut etre des sujets similaires ici, mais je ne les aient pas trouvé.
Pour être franc, je ne sais pas trop formuler avec les mots justes ce que je recherche.
Je vais donc vous expliquer avec un exemple :
#1
Dans le général , j'ai une page sur laquelle j'ai codé une tabs. Donc différent petits onglets. C'est une page que j'ai appelé "Photos".
Dans la tab, donc 4 onglets : Tout, pension, pensionnaire, autre.
La tab active par défaut (a l'ouverture de la page est "toutes").

Jusque la, tout va bien

#2
J'ai créé juste en dessous de la tabs (sur la même page) un lien (ou bouton) qui a pour effet (lors du clic) d'afficher la tab 2 (soit pension).
La encore tout va bien.

#3
Mais la partie #2 n'était qu'un test, car en réalité je n'en ai pas besoin. Par contre j'ai besoin d'un lien qui m'affiche la tab 2 lorsque je clique dessus... mais ce lien serait sur une autre page.
Pour être clair, le lien serait sur la page "Qui sommes nous" et que dans "qui sommes nous" après le blabla, je voudrais un lien qui affiche la page photo mais directement sur la tab2 (et non pas sur celle par défaut "toutes").

Voila c'est un peu tarabiscoté, mais y a t'il une solution ?

Voici mes codes :


<div class="tab">
<button class="tablinks" onclick="openPhotoscat(event, 'toutes')" id="defaultOpen">Toutes</button>
<button class="tablinks" onclick="openPhotoscat(event, 'pension')">pension</button>
<button class="tablinks" onclick="openPhotoscat(event, 'pensionnaires')">pensionnaires</button>
<button class="tablinks" onclick="openPhotoscat(event, 'autres')">Autres</button>
</div>

<div id="toutes" class="tabcontent">
<span onclick="this.parentElement.style.display='none'" class="topright">&times</span>

.........................

</div>

<div id="pension" class="tabcontent">
<span onclick="this.parentElement.style.display='none'" class="topright">&times</span>
.......................

</div>

<div id="pensionnaires" class="tabcontent">
<span onclick="this.parentElement.style.display='none'" class="topright">&times</span>



..................
</div>

<div id="autres" class="tabcontent">
<span onclick="this.parentElement.style.display='none'" class="topright">&times</span>



..................

</div>

<script>
function openPhotoscat(evt, photosCat) {
var i, tabcontent, tablinks;
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent.style.display = "none";
}
tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks.className = tablinks.className.replace(" active", "");
}
document.getElementById(photosCat).style.display = "block";
evt.currentTarget.className += " active";
}

// Get the element with id="defaultOpen" and click on it
document.getElementById("defaultOpen").click();
</script>

Lien test sur la même page (qui fonctionne):

<a href="#" onclick="openPhotoscat(event, 'pension')">test</a>

Maintenant comment avoir le même résultat que ce dernier lien en arrivant depuis une autre page (la page qui sommes nous, ou accueil peu importe) ?

Pour information, je code pour un site sous wp, je ne sais pas si ca aura une incidence ou pas ?

Si vous avez des pistes, des liens ou une aide, je suis preneur ?
J'ai essayé mais ca ne fonctionne pas :

<a href="http://www.monsite.bzh/photos/" onclick="openPhotoscat(event, 'pension')">test</a>

Merci d'avance (et bonne année)
Gael

[webmaster]

Bonjour,

Pour passer une information d'une page à l'autre, il y a plusieurs solutions
1 : les cookies, mais c'est sans doute excessif puisqu'il n'y a pas besoin de garder l'information
2 : l'origine, avec document.referrer https://www.toutjavascript.com/referenc ... ferrer.php
3 : passer un parametre dans l'url avec un #param https://www.toutjavascript.com/referenc ... p#monAncre

Il suffit de détecter le paramètre au chargement de la page pour forcer l'affichage de l'onglet correspondant