<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

​

<!-- Trigger/Open The Modal -->

<a href="#myModal1" class="modal-button">• Click Me</a>

​

<!-- The Modal -->

<div id="myModal1" class="modal">

​

  <!-- Modal content -->

  <div class="modal-content">

    <div class="modal-header">

      <span class="close">×</span>

      <div class="headertext">

             Modal Header

      </div>

    </div>

    <div class="modal-body">

      <img class="pic" src="https://drive.google.com/thumbnail?id=108ZLeoIfNkKODfRbLuPWpmXRl0gH9qkD">

      <div class="bodytext">

           Your are viewing first modal<br>

<a href="#myModal2" class="modal-button">Click Here to Open Second Modal</a>

      </div>

    </div>

  </div>

</div>

​

​

<!-- The Modal -->

<div id="myModal2" class="modal">

​

  <!-- Modal content -->

  <div class="modal-content">

    <div class="modal-header">

      <span class="close">×</span>

      <div class="headertext">

             Modal Header

      </div>

    </div>

    <div class="modal-body">

      <img class="pic" src="https://drive.google.com/thumbnail?id=108ZLeoIfNkKODfRbLuPWpmXRl0gH9qkD">

      <div class="bodytext">

     Your are currently viewing second modal

      </div>

    </div>

  </div>

</div>

​

​

<p>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque arcu est, lacinia ut posuere ut, lacinia quis ipsum. Quisque eleifend quam velit, nec accumsan ligula maximus eget. Praesent diam lorem, auctor quis justo sit amet, pretium molestie odio. Proin at est sed augue vestibulum malesuada at non lorem. Donec sit amet nisi dapibus, venenatis enim id, tristique enim. Maecenas vel sagittis arcu. Praesent et cursus tellus. Donec rhoncus blandit arcu, eu rhoncus dui semper vel. Interdum et malesuada fames ac ante ipsum primis in faucibus. Pellentesque eu nulla luctus, consectetur leo id, ornare urna.

​

Integer id molestie libero, in pulvinar diam. Donec non massa metus. Integer ut velit nec turpis fermentum iaculis et sagittis dui. Vestibulum vel dignissim lectus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec ac luctus lacus, ac ultrices arcu. Curabitur dignissim arcu mauris, et eleifend lacus imperdiet nec.

​

Nullam eleifend massa metus, vitae sagittis erat egestas vel. Maecenas fringilla, risus ut maximus mattis, nibh lacus maximus quam, at elementum erat lectus ac urna. Aenean egestas eleifend neque, et egestas justo condimentum a. Fusce in dapibus ligula. Aliquam dui felis, vestibulum quis est a, facilisis auctor est. Vestibulum ac elit eu mauris gravida aliquam sed ut orci. Ut tincidunt lacus non gravida pharetra.

</p>