jQuery Lightbox效果插件Boxer

演示：http://www.jq22.com/yanshi1139

下载：链接: https://pan.baidu.com/s/1o8zaV2q 密码: 2ccy

 

 

Boxer 是一款基于 jQuery 的 Lightbox 效果插件，可用于显示图片、视频、iframe和其他内容，和其他Lightbox 效果插件一样，Boxer 在显示组图的时候，有左右箭头控制。Boxer 还能自动检测设备是否为移动设备，针对移动设备显示更适合的样式和更友好的触摸控制。

兼容性

浏览器兼容：simpleGal 兼容所有浏览器，包括 IE6。

jQuery 版本兼容：simpleGal 兼容 1.7 以上版本。

 

 

使用方法

以下介绍最基本的用法，更多用法请查看参数或演示。

1、引入文件

<link rel="stylesheet" href="css/jquery.fs.boxer.css"> <script src="js/jquery.min.js"></script> <script src="js/jquery.fs.boxer.js"></script>

2、HTML

<a title="标题闪电闪电" href="images/1b.jpg">     <img src="http://www.dowebok.com/images/1s.jpg" alt=""> </a>

标签 a 的属性 title 用于显示图片的标题。

3、JavaScript

$('.boxer').boxer();

参数

 

参数类型默认值说明callbackfunction空打开后的回调函数customClassstring”增加自定义 classdurationint250动画持续时间fixedbooleanfalse是否固定在浏览器中央（不显示关滚动条）formatterfunction空标题格式函数heightint100加载时的初始高度labels.closestring‘Close’关闭按钮的文字labels.countstring‘of’组图的文字labels.nextstring‘Next’下一个按钮的文字labels.previousstring‘Previous’上一个按钮的文字marginint50与浏览器视口的边距minHeightint100最小高度minWidthint100最小宽度mobilebooleanfalse是否强制使用移动模式显示opacitynumber0.75遮罩不透明度retinabooleanfalse是否兼容 retina 高清显示requestKeystring‘boxer’GET variable for ajax / iframe requeststopint 距离顶部位置videoRadionumber0.5625视频的高度videoWidthint600视频的宽度widthint100加载时的初始宽度

转载于:https://www.cnblogs.com/agen-su/p/7793258.html