magnify.js是一款jquery图片查看插件。magnify.js插件以lightbox的方式来展示图片，并且lightbox窗口可以自由的拖动，图片可以缩放，旋转，最大化等，功能非常强大。
magnify.js特点
- lightbox模态窗口可以自由拖动，修改尺寸和全屏最大化。
- 可以使用鼠标来移动图片进行查看。
- 可以使用鼠标或功能按钮来缩放图片。
- 图片可以进行旋转。
- 支持键盘控制。
- 响应式设计。
magnify.js使用
1、引入
<link href="/path/to/font-awesome.min.css" rel="stylesheet">
<link href="/path/to/magnify.css" rel="stylesheet">
<script src="/path/to/jquery.js"></script>
<script src="/path/to/jquery.magnify.js"></script>
2、html
<img data-magnify="gallery" data-src="big-1.jpg" src="small-1.jpg">
<img data-magnify="gallery" data-src="big-2.jpg" src="small-2.jpg">
<img data-magnify="gallery" data-src="big-3.jpg" src="small-3.jpg">
3、初始化
$("[data-magnify=gallery]").magnify();
data-*属性说明：
data-src：该属性是大图的url地址。
data-caption：该属性用于显示图片的标题。
data-group：该属性用于对图片进行分组。
仅供个人学习参考/导航指引使用，具体请以第三方网站说明为准，本站不提供任何专业建议。如果地址失效或描述有误，请联系站长反馈～感谢您的理解与支持！
链接: https://fly63.com/nav/277
