1. 产品
  2.   图片
  3.   JavaScript
  4.   LightGallery
 
  

响应式和可定制的图片库插件

Lightgallery.js 是一个有用的开源图像调整器和定制器。

Lightgallery.js 是一个有用且高度可定制的插件，非常适合在网站上加载和显示视频和图像时需要大量功能的项目。它完全使用 JavaScript 和 CSS 开发，是一个功能齐全的灯箱库，为开发人员提供了许多选择。

作为一个开源的、免费使用的插件 Lightgallery.js，当您需要那些额外的选项而不是调整大小以及以画廊的形式将图像和视频资产上传到您的网站时，它会派上用场。它还在幻灯片中存储图像和视频的浏览器历史记录，并为每个图库图像提供唯一的 URL。它不仅速度快，而且是轻量级、模块化、响应式的灯箱图库创建器，不会影响内存性能。

Previous Next

开始使用 LightGallery

通过 NPM 安装 LightGallery 的推荐方式。请使用以下命令进行安装。

通过 NPM 安装 LightGallery

 npm install lightgallery.js

用于图像处理的免费 JavaScript API

Lightgallery.js 带有许多内置模块，例如创建缩略图、全屏、放大和缩小等，如果您不需要它们可以丢弃。您还可以根据项目的要求添加自己的模块。与调整图像和视频大小的 JavaScript 方法相反，Lightgallery.js 使用纯 CSS 方法进行响应式调整大小，使其更快、更灵活。通过简单地更新画廊的 SASS 变量，您可以轻松地自定义插件以满足您的需求。

通过免费的 JavaScript API 创建缩略图

在缩略图方面，Lightgallery.js 允许您启用动画缩略图，就像 YouTube 一样，给人一种更现代的感觉。还可以为您的 YouTube 或 Vimeo 画廊激活动画缩略图。 Lightgallery.js 在插件中内置了 20 多个动画，可用于创建漂亮的画廊。

通过JavaScript号创建静态图书馆

 lightGallery(document.getElementById('static-thumbnails'), {
    animateThumb: false,
    zoomFromOrigin: false,
    allowMediaOverlap: true,
    toggleThumb: true,
});

通过JavaScript定制图书馆创作

 lightGallery(document.getElementById('customize-thumbnails-gallery'), {
    // Add a custom class to apply style only for the particular gallery
    addClass: 'lg-custom-thumbnails',
    // Remove the starting animations.
    // This can be done by overriding CSS as well
    appendThumbnailsTo: '.lg-outer',
    animateThumb: false,
    allowMediaOverlap: true,
});
 中国人