图片展示
## onion.myPreviewImg / onion.dbPreviewImg
### 1. 功能
都是使用弹出层, 展示图片
### 2. 使用场景
### 3. 如何使用
#### 3.1 传入图片内容对象, 图片地址命名必须为 `src`
```js
onion.myPreviewImg (this)
```
#### 3.2 当传入的 this内有图片 `id` 时
```js
onion.dbPreviewImg (this)
```
### 4. api定义
``` javascript
var clickTimer = null;
onion.myPreviewImg = function myPreviewImg(obj) {
if (clickTimer) {
window.clearTimeout(clickTimer);
clickTimer = null;
}
clickTimer = window.setTimeout(function () {
var img = new Image();
img.src = obj.src;
var dom = $(obj);
var height = dom[0].naturalHeight;
var width = dom[0].naturalWidth;
var imgHtml = "<img src='" + obj.src + "' style='width: auto;'/>";
//弹出层
layer.open({
type: 1,
shade: 0.8,
offset: 'auto',
zIndex: 1,
area: ['89%', '89%'],
shadeClose: true,
scrollbar: true,
title: "图片预览(" + width + " x " + height + ")",
content: imgHtml,
cancel: function () {}
});
}, 300);
};
onion.dbPreviewImg = function dbPreviewImg(obj) {
if (clickTimer) {
window.clearTimeout(clickTimer);
clickTimer = null;
}
var img = new Image();
img.src = obj.src;
var imgId = obj.id;
var dom = document.getElementById(imgId);
var height = dom.naturalHeight;
var width = dom.naturalWidth;
var imgHtml = "<img src='" + obj.src + "' style='width: auto;'/>";
//弹出层
layer.open({
type: 1,
shade: 0.8,
offset: 'auto',
zIndex: 1,
area: ['89%', '89%'],
shadeClose: true,
scrollbar: true,
title: "图片预览(" + width + " x " + height + ")",
content: imgHtml,
cancel: function () {}
});
};
```