How to get a link to go to a page with the activation of a certain section of the gallery (made in jquery)?

Question

css

Wrote on HTML site - vertigo-mebel.ru .
On it, in the "Our Works" section, there is a gallery made on fancybox with Spanish. jquery (used a ready-made gallery ).
On the main page at the bottom I made a grid of 8 pictures, which should lead to the page with galleries and activate the corresponding section. Only here is the jQuery gallery, and the sections are not links. I don’t know anything about jquery at all, but the site asked me to make it familiar.

Can you please tell me how to make it so that when you click on the link, this page opens and a certain section is activated?

Answer 1

So, if you do it in a simple way, then you can try this option:
1. Add the corresponding parameter to all links on the main page in the href attribute (you can also implement it through a cookie, but this option will be easier):
replace with

href="gallery.html?kl1"
href="gallery.html?kl2"
href="gallery.html?kl3"
...
href="gallery.html?obiv"

etc.
2. Further, already on the page with the gallery, you need to read this parameter from the URL. If the parameter matches, simulate clicking on the corresponding filter:

$( document ).ready(function() {
    if(window.location.href.indexOf("kl1") > -1) {// ищем в урле параметр
     $('[data-category="kl1"]').click(); //симулируем нажатие на выбор категории на странице с галереей
    } else if(window.location.href.indexOf("kl2") > -1){
$('[data-category="kl2"]').click(); //симулируем нажатие на выбор категории на странице с галереей
} .... (window.location.href.indexOf("obiv") > -1){
$('[data-category="obiv"]').click(); //симулируем нажатие на выбор категории на странице с галереей
} 
});

Answer 2

Please take a look, maybe I did something wrong, the required section is still not activated.
Changed in index.html file:

<div class="content-folio">
        <br><p>Наши работы:</p><br><br>
        <div class="folio-cards">
          <a href="gallery.html?kl1">
           <div class="folio-card" id="Iklass">
            <img src="images/gallery/1klass/k1%20(1).jpg" alt="">
           <h2><span>I класс</span></h2>
        </div></a>
        <a href="gallery.html?kl2">
        <div class="folio-card">
            <img src="images/gallery/2klass/k2%20(1).jpg" alt="">
           <h2><span>II класс</span></h2>
        </div>
        <a href="gallery.html?kl3">
        <div class="folio-card">
            <img src="images/gallery/3klass/k3%20(1).jpg" alt="">
           <h2><span>III класс</span></h2>
        </div></a>
        <a href="gallery.html?kozh">
        <div class="folio-card">
            <img src="images/gallery/kozh/k%20(12).jpg" alt="">
           <h2><span>Кожаная<br>мебель</span></h2>
        </div></a>
        <a href="gallery.html?pered">
        <div class="folio-card">
            <img src="images/gallery/pered/p%20(1).jpg" alt="">
           <h2><span>Реставрация<br>с переделкой</span></h2>
        </div></a>
        <a href="gallery.html?dom">
        <div class="folio-card">
            <img src="images/gallery/dom/dom%20(12).jpg" alt="">
           <h2><span>Мелкий ремонт<br>на дому</span></h2>
        </div></a>
        <a href="gallery.html?exc">
        <div class="folio-card">
            <img src="images/gallery/exc/e%20(1).jpg" alt="">
           <h2><span>Мебель<br>на заказ</span></h2>
        </div></a>
        <a href="gallery.html?obiv">
        <div class="folio-card">
            <img src="images/gallery/obiv/o%20(3).jpg" alt="">
           <h2><span>Кровати с<br>мягкой обивкой</span></h2>
        </div></a>                        
        </div>
    </div>

In the gallery.html file, at the end of the document, before the closing body tag, I added:

$( document ).ready(function() {
   if(window.location.href.indexOf("kl1") > -1) {
   $('[data-category="kl1"]').click();
   } else if(window.location.href.indexOf("kl2") > -1){
   $('[data-category="kl2"]').click();
   } (window.location.href.indexOf("obiv") > -1){
   $('[data-category="obiv"]').click();
   } 
   });

I also tried to put it in a separate .js file and connect it to the site, but it didn’t help either.