Coding... play frontend script with beautiful models~~


HTML Code:

                  <body>
                    <div id="lightgallery">
                      <a href="img/img1.jpg">
                          <img src="img/thumb1.jpg" />
                      </a>
                      <a href="img/img2.jpg">
                          <img src="img/thumb2.jpg" />
                      </a>
                        ...
                    </div>
                    <!-- jQuery version must be >= 1.8.0; -->
                    <script src="jquery.min.js"></script>
                
                    <!-- A jQuery plugin that adds cross-browser mouse wheel support. (Optional) -->
                    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-mousewheel/3.1.13/jquery.mousewheel.min.js"></script>
                
                    <script src="js/lightgallery.min.js"></script>
                
                    <!-- lightgallery plugins -->
                    <script src="js/lg-thumbnail.min.js"></script>
                    <script src="js/lg-fullscreen.min.js"></script>
                  </body>
                

JavaScript Code:

                  <script type="text/javascript">
                      $(document).ready(function() {
                          $("#lightgallery").lightGallery(); 
                      });
                  </script>