lazyload.js
1.4 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
require('./webp-support');
const $ = require('yoho-jquery');
require('jquery-lazyload');
/**
* 图片链接处理
*/
const imgSrcHandle = (imgUrl, params) => {
if (!imgUrl) {
return imgUrl;
}
let splits = imgUrl.split('?');
let url = splits[0];
let query = splits[1] || '';
if (!query || query === 'imageslim') {
if (window.supportWebp) {
url += `?imageView2/0/interlace/1/format/webp/q/${params.q}`;
} else {
let extQuery = params.q === 75 ? '?imageslim' : `?imageView2/0/interlace/1/q/${params.q}`;
url += extQuery;
}
}
return url;
};
/**
* 图片链接预处理后使用原生 lazyload
*/
const rawLazyload = (selector, options) => {
let $imgs;
let params = {
threshold: 600
};
let imgParams = {
q: options && options.q || 75
};
if (selector instanceof $) {
$imgs = selector;
} else {
$imgs = $(selector).find('img.lazy');
}
$.extend(params, options);
const imgsProcess = () => {
$imgs.each((index, elem) => {
$(elem).attr('data-original', imgSrcHandle($(elem).data('original'), imgParams));
});
$imgs.lazyload(params);
};
if (typeof window.supportWebp !== 'undefined') {
imgsProcess();
} else {
$(document).on('supportWebp', imgsProcess);
}
};
module.exports = rawLazyload;