在 Bootstrap3 框架中实现的模态弹出框图库插件,支持多种方式切换预览

    一款轻量级 jQuery 插件,用于创建包含多张图片的 Bootstrap 灯箱图库布局,该插件能在 Bootstrap 模态中创建完美的图库功能,这些图片可以通过下一个、上一个按钮或键盘方向键进行导航切换,此外,它还能在模态图库中生成内嵌缩略图,需要注意的事,该插件只可以和Bootstrap 3x版本使用,其他版本目前不支持。下面是一些可配置的选项:

高级配置选项

以下是创建/自定义“模态图库”的一些高级配置选项。

title此选项定义标题并将其显示在模态框的顶部。默认值:'图片库',类型:字符串。

$(document).modalery({ 
   title : "我的模态画廊" ,
});
navigate决定是否显示导航(下一个和上一个)按钮来导航图像。默认值:false,类型:布尔值。

$(document).modaly({ 
   navigate :true ,
});
arrows显示或隐藏箭头图标。默认值:false,类型:布尔值。

$(document).modaly({ 
   arrows :true ,
});
keypress允许通过键盘箭头键浏览图像。默认值:false,类型:布尔值。

$(document).modaly({
   keypress:true ,
});
size设置 Bootstrap 可用的模态框尺寸:sm 或 lg 等。默认值:null,类型:字符串。

$(document).modaly({ 
   size :“lg” ,
});
caller选择器,Modallery 要查找的图像类。默认值:'modalry',类型:String。

$(document).modaly({ 
   caller :“my-class” ,
});
模板目录结构如下: