lightbox2：轻量级灯箱插件

📅 2025-06-17

配置项

默认配置

在 Lightbox.defaults 中定义了 Lightbox 的默认配置选项：

Lightbox.defaults = {
  albumLabel: 'Image %1 of %2',
  alwaysShowNavOnTouchDevices: false,
  fadeDuration: 600,
  fitImagesInViewport: true,
  imageFadeDuration: 600,
  // maxWidth: 800,
  // maxHeight: 600,
  positionFromTop: 50,
  resizeDuration: 700,
  showImageNumberLabel: true,
  wrapAround: false,
  disableScrolling: false,
  sanitizeTitle: false
};

选项解释

albumLabel

  • 类型: String
  • 默认值: 'Image %1 of %2'
  • 描述: 用于显示相册中当前图片的编号和总数的标签格式。%1 会被替换为当前图片的编号，%2 会被替换为相册中图片的总数。

alwaysShowNavOnTouchDevices

  • 类型: Boolean
  • 默认值: false
  • 描述: 在触摸设备上是否始终显示图片导航按钮（上一张和下一张）。

fadeDuration

  • 类型: Number
  • 默认值: 600
  • 描述: Lightbox 淡入淡出效果的持续时间（毫秒）。

fitImagesInViewport

  • 类型: Boolean
  • 默认值: true
  • 描述: 是否将图片自适应到视口范围内。如果设置为 true，图片会根据视口大小进行缩放。

imageFadeDuration

  • 类型: Number
  • 默认值: 600
  • 描述: 图片淡入效果的持续时间（毫秒）。

maxWidth 和 maxHeight

  • 类型: Number
  • 默认值: 未设置
  • 描述: 图片的最大宽度和最大高度。如果图片的尺寸超过了这些值，图片会按比例缩放以适应这些限制。

positionFromTop

  • 类型: Number
  • 默认值: 50
  • 描述: Lightbox 距离视口顶部的距离（像素）。

resizeDuration

  • 类型: Number
  • 默认值: 700
  • 描述: Lightbox 调整大小动画的持续时间（毫秒）。

showImageNumberLabel

  • 类型: Boolean
  • 默认值: true
  • 描述: 是否显示图片编号标签。

wrapAround

  • 类型: Boolean
  • 默认值: false
  • 描述: 是否允许在相册的第一张和最后一张图片之间循环切换。如果设置为 true，在最后一张图片上点击下一张会回到第一张，在第一张图片上点击上一张会跳到最后一张。

disableScrolling

  • 类型: Boolean
  • 默认值: false
  • 描述: 当 Lightbox 打开时，是否禁用页面滚动。

sanitizeTitle

  • 类型: Boolean
  • 默认值: false
  • 描述: 是否对图片标题进行安全处理。如果设置为 true，会将标题作为纯文本处理，防止 XSS 攻击；如果设置为 false，可以在标题中使用 HTML 标签。