Откройте окно на том же сайте с jQuery

Question

Извините за мой Engli sh ...

Я хочу, чтобы, когда кто-то нажимал на значок зума, он открывал маленький окно в Сайте и в этом небольшом окне я описываю продукт.

Код с картинки

<div class="container-fluid">
    <div class="row">

         <div class="col"> 

          <div class="product-grid">

                <div class="product-image">
                   <a class="link" href="/tachen_&_rucksacke/fenster/mochila_doble_tirantes-violeta.php">
                    <img alt=""  class="bild" src="photo/111.jpg">     
                   </a> 

                </div>

                <div class="product-content">
                     <a class="links" href="/tachen_&_rucksacke/fenster/mochila_doble_tirantes-violeta.php">
                    <p class="title">Mochila doble tirantes Violeta</p>
                    </a>     

                </div>
                    <div class="price">$16.00</div>

                     <div class="div-zoom">

                   <span class="zum-warenkorb">zum warenkorb hinzufügen</span>
                   <i class="fa fa-search-plus" style="font-size: 94%; color: white; background-color:  #595959; padding: 3%;"></i>
                 </div> 
            </div>
        </div>
</div>

Здесь - код с Сайта.

Я использую Bootstrap 4 с сеткой. .

Что я хочу, так это то, что когда кто-то нажимает на значок масштабирования, он открывает небольшое окно на Сайте, и в этом небольшом окне я описываю продукт.

Может кто-нибудь помочь мне и объяснить легкими словами, как решить эту проблему с jQuery, Спасибо

Answer 1

Кажется, вы ищете модал. Bootstrap Официальная документация содержит четкое и подробное руководство для вашей работы. Перейдите по этой ссылке. https://getbootstrap.com/docs/4.4/components/modal/

ПРИМЕЧАНИЕ. Перед использованием Bootstrap модалов необходимо настроить jquery и popper. js в вашем проекте. Вам нужно скачать их отдельно. Затем вы можете использовать их локально в вашем проекте или использовать CDN для этого, если вам не нужно их загружать. Эта ссылка поможет вам в этом. https://getbootstrap.com/docs/4.4/getting-started/download/