{"_id":"@boses/img-lazyload","_rev":"1-6036b87fdce6c1fb74480fa97254501d","name":"@boses/img-lazyload","dist-tags":{"latest":"1.0.0"},"versions":{"1.0.0":{"name":"@boses/img-lazyload","author":{"name":"boses"},"desription":"Lazy loading of pictures","keywords":["lazyload","img","lazy"],"bugs":{"url":"https://github.com/bosens-China/img-lazyload/issues"},"version":"1.0.0","main":"./dist/imgLazyload.common.js","exports":{"require":"./dist/imgLazyload.common.js","default":"./dist/imgLazyload.esm.js"},"repository":{"type":"git","url":"git+https://github.com/bosens-China/img-lazyload.git"},"jsnext:main":"./dist/imgLazyload.esm.js","types":"./typings/lazyload.d.ts","license":"MIT","devDependencies":{"@babel/core":"^7.10.3","@babel/preset-env":"^7.10.3","@babel/preset-typescript":"^7.10.4","@rollup/plugin-babel":"^5.0.4","@typescript-eslint/eslint-plugin":"^3.4.0","@typescript-eslint/parser":"^3.4.0","eslint":"^7.3.1","eslint-config-alloy":"^3.7.3","rollup":"^2.18.0","rollup-plugin-clear":"^2.0.7","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-filesize":"^9.0.2","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^6.1.0","rollup-plugin-typescript2":"^0.27.1","typescript":"^3.9.5"},"scripts":{"build":"rollup -c"},"gitHead":"605b6fc3181f455c8ad7fc4474ace5e45c6686e6","description":"![size](https://img.shields.io/badge/size-2.4KB-blue) ![License](https://img.shields.io/badge/License-MLT-blue)","homepage":"https://github.com/bosens-China/img-lazyload#readme","_id":"@boses/img-lazyload@1.0.0","_nodeVersion":"14.2.0","_npmVersion":"6.14.4","dist":{"integrity":"sha512-u+AnuWufIQ4NuDzKstzc6Vt9NrV6beVzuIo+CAcI2imWrcku2WbmnB6fq9xUAQcDm8JBel5V8OznJBK5N1WBgQ==","shasum":"de7df3bbaac578d40a6e3563fb770a477de72358","tarball":"https://registry.npmjs.org/@boses/img-lazyload/-/img-lazyload-1.0.0.tgz","fileCount":11,"unpackedSize":36742,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe/FxICRA9TVsSAnZWagAATsQP/3lCrdC9nHgLIco6T6V9\nMwF1gMsOpYUGkfmZz++CiUAK2HrFipmeL6ghqk6i0tTTPOH8SQXtj1WJEJbm\nhUXbd2uuKgceJUR7YLqcNZSSkGX6Jafpy+zCl5E0+NwLTEeJytUAMJWfoUyF\n1SDRv3ZUVuYtYEY98BZ0cU+OrySDt6yivLD+RoKmVIwv1kusPODPk8/55vBn\nuv+uXVfY+2wDu/E0imEkrz+qd9hVI47oKiDwWuD0sETtPiW1pTYOJE+W6ZU7\n3qI6ss/uupuU8+/boZUdxn35tKSYRgtZflLRVR7SsDj9k0myOY5Sq9gAjlDX\ncSBLQ3DkHcPH1VvQcvSnSy2oKQ3b+H9Pzxvi5asPhzEs31Ddmc9wtF9bP+Im\n+DyL4IUwBzoxVtGuWHi6m+RrNua5HxgcK9lWGhPKdwcYEsuIUBxFHsiu3PSn\nroOdDkz/v+H8seiLf64ItKdepWUhBfkfVrPxQnMFA+m2zEAcMx0vb6BBLaGl\nqImRQ5cE7oDjQMCf/ETz84VoiXCHQTX72QDh8JMh9RCWMKzZAOlAi7G6K5ec\ntq8+ue6lhObD7izRmc/1nbtAA0x8acPXRcWI1KFAhehO8CrJxkO7K77s0cmV\nKJMpMQsjulEIUu+PlDy5Imb9N9KC5eaWuTmnYREE0Pgk7S10dtMHFBkf7shI\nZV1T\r\n=LBTB\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBV0JidXIXmHuv6T+77UY15Xc7xLohOtnF0M1PGFUy0YAiEA8nN2fJJrUnPa3sldM7o06O93auYZHO12uUyCM7yKZm8="}]},"maintainers":[{"name":"cs-xy","email":"1123598783@qq.com"}],"_npmUser":{"name":"cs-xy","email":"1123598783@qq.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/img-lazyload_1.0.0_1593597000157_0.11629339661076465"},"_hasShrinkwrap":false}},"time":{"created":"2020-07-01T09:49:59.791Z","1.0.0":"2020-07-01T09:50:00.318Z","modified":"2022-04-04T20:13:24.015Z"},"maintainers":[{"name":"cs-xy","email":"1123598783@qq.com"}],"description":"![size](https://img.shields.io/badge/size-2.4KB-blue) ![License](https://img.shields.io/badge/License-MLT-blue)","homepage":"https://github.com/bosens-China/img-lazyload#readme","keywords":["lazyload","img","lazy"],"repository":{"type":"git","url":"git+https://github.com/bosens-China/img-lazyload.git"},"author":{"name":"boses"},"bugs":{"url":"https://github.com/bosens-China/img-lazyload/issues"},"license":"MIT","readme":"# img-lazyload\n\n![size](https://img.shields.io/badge/size-2.4KB-blue) ![License](https://img.shields.io/badge/License-MLT-blue)\n\n[中文文档](./README_ZH.md)\n\nIt does not rely on high-performance JavaScript library, with a size of `2.4kb`. It supports modification of `src` and other elements `backgroundimage` attributes under img tag by default.\n\nBefore using this library, you need to pay more attention to: **for the elements that need to be loaded lazily, you must set a `width height` or an initial image**.\n\n```html\n<img src=\"xxx.png\" />\n<!-- or -->\n<img src=\"xxx.png\" style=\"width: 500px; width: 700px;\" />\n```\n\n## install\n\n```sh\nnpm i @boses/img-lazyload\n# or\nyarn add @boses/img-lazyload\n```\n\n## usage method\n\n```html\n<!-- style -->\n<style>\n  img {\n    width: 800px;\n    height: 800px;\n  }\n</style>\n<!-- body Element -->\n<img data-src=\"http://pic2.nipic.com/20090422/1562745_010030787_2.jpg\" />\n<img\n  data-src=\"https://gss0.baidu.com/9fo3dSag_xI4khGko9WTAnF6hhy/zhidao/pic/item/faedab64034f78f07595c8f874310a55b3191c1a.jpg\"\n/>\n<img data-src=\"http://img.ylq.com/2016/0816/20160816094144656.jpg\" />\n```\n\n```js\nimport imgLazyload from \"@boses/img-lazyload\";\nimgLazyload(\"img\");\n```\n\nFor the `img` tag, when the element is visible, the value of the `data-src` attribute of the element is assigned to the SRC attribute of the element;\n\nFor non `img` tags, `backgroundimage` is used by default. When the element is visible, the value of the element `data-src` attribute is assigned to the `backgroundimage` attribute of the element;\n\n## api\n\n```js\nlazyload(el: el, option?: options): void\n```\n\n- el:`string | Element | NodeList`\n\n##### option?\n\n| name     | type                    | default  | required | describe                              |\n| -------- | ----------------------- | -------- | -------- | ------------------------------------- |\n| dataSrc  | `string`                | data-src | `false`  | The actual URL address of the element |\n| callback | `(el: Element) => void` | none     | `false`  | callback                              |\n\nThe following is an advanced example. Load the image and clear the `data-src` attribute of the element. The style element of HTML is the same as above.\n\n```js\nimport imgLazyload from \"@boses/img-lazyload\";\nimgLazyload(\"img\", {\n  callback(el) {\n    const src = el.getAttribute(\"data-src\");\n    el.src = src;\n    el.removeAttribute(\"data-src\");\n  },\n});\n```\n\n## License\n\nMIT License\n","readmeFilename":"README.md"}