Get started with light7 CDN


<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" href="https://cdn.cdnhub.io/light7/0.4.3/css/light7.min.css">
  <script src="https://cdn.jsdelivr.net/npm/light7@0.4.3/dist/light7.min.js"></script>
  <style>
    body {
      margin: 0;
      padding: 0;
    }
    #my-image {
      width: 100%;
      height: 100vh;
      object-fit: cover;
    }
  </style>
</head>
<body>
  <img id="my-image" src="path/to/your/image.jpg" alt="Your Image">
  <script>
    const lightGallery = lightgallery({
      selector: '#my-image', // the image element selector
      plugins: [
        lightgalleryPlugin(lgZoom), // enable zoom plugin
      ],
    });
  </script>
</body>
</html>

https://cdn.cdnhub.io/light7/0.4.3/css/light7-swipeout.css Copied!

https://cdn.cdnhub.io/light7/0.4.3/css/light7-swipeout.min.css Copied!

https://cdn.cdnhub.io/light7/0.4.3/css/light7-swipeout.min.css.map Copied!

https://cdn.cdnhub.io/light7/0.4.3/css/light7-swiper.css Copied!

https://cdn.cdnhub.io/light7/0.4.3/css/light7-swiper.min.css Copied!

https://cdn.cdnhub.io/light7/0.4.3/css/light7.css Copied!

https://cdn.cdnhub.io/light7/0.4.3/css/light7.min.css Copied!

https://cdn.cdnhub.io/light7/0.4.3/img/i-f7.png Copied!

https://cdn.cdnhub.io/light7/0.4.3/img/i-form-calendar.png Copied!

https://cdn.cdnhub.io/light7/0.4.3/img/i-form-comment.png Copied!

https://cdn.cdnhub.io/light7/0.4.3/img/i-form-email.png Copied!

https://cdn.cdnhub.io/light7/0.4.3/img/i-form-gender.png Copied!

https://cdn.cdnhub.io/light7/0.4.3/img/i-form-name.png Copied!

https://cdn.cdnhub.io/light7/0.4.3/img/i-form-password.png Copied!

https://cdn.cdnhub.io/light7/0.4.3/img/i-form-settings.png Copied!

https://cdn.cdnhub.io/light7/0.4.3/img/i-form-tel.png Copied!

https://cdn.cdnhub.io/light7/0.4.3/img/i-form-toggle.png Copied!

https://cdn.cdnhub.io/light7/0.4.3/img/i-form-url.png Copied!

https://cdn.cdnhub.io/light7/0.4.3/img/i-list-chevron-right.png Copied!

https://cdn.cdnhub.io/light7/0.4.3/img/i-sortable-handler.png Copied!

https://cdn.cdnhub.io/light7/0.4.3/js/i18n/cn.js Copied!

https://cdn.cdnhub.io/light7/0.4.3/js/i18n/cn.min.js Copied!

https://cdn.cdnhub.io/light7/0.4.3/js/light7-city-picker.js Copied!

https://cdn.cdnhub.io/light7/0.4.3/js/light7-city-picker.min.js Copied!

https://cdn.cdnhub.io/light7/0.4.3/js/light7-swipeout.js Copied!

https://cdn.cdnhub.io/light7/0.4.3/js/light7-swipeout.min.js Copied!

https://cdn.cdnhub.io/light7/0.4.3/js/light7-swipeout.min.js.map Copied!

https://cdn.cdnhub.io/light7/0.4.3/js/light7-swiper.js Copied!

https://cdn.cdnhub.io/light7/0.4.3/js/light7-swiper.min.js Copied!

https://cdn.cdnhub.io/light7/0.4.3/js/light7.js Copied!

https://cdn.cdnhub.io/light7/0.4.3/js/light7.min.js Copied!

Get started with light7 CDN

Stable version

How to start using light7 CDN

All versions