{"_id":"@daxiazilong/image-preview","_rev":"5-81b9c58f4d2966e50283b6f201e21af9","name":"@daxiazilong/image-preview","dist-tags":{"latest":"2.3.0"},"versions":{"2.1.1":{"name":"@daxiazilong/image-preview","version":"2.1.1","description":"preview image on web page。rotate,zoom.etc. 移动端JS 图片预览 插件 支持 预览图片，旋转，放大(双指/双击)。","keywords":["image preview","viewer","preview image"],"main":"release/image-preview/image-preview-esm-min.js","scripts":{"start":"webpack serve --open Chrome.exe --mode=development","build":"node scripts/beforeBuild.js && npm run genModule","compileTs":"tsc --project ./src","buildTest":"webpack --mode=production","genModule":"./scripts/genModule.sh","release":"standard-version"},"repository":{"url":"git+https://github.com/daxiazilong/image-preview.git"},"author":{"name":"zilong"},"dependencies":{},"devDependencies":{"@commitlint/cli":"^12.1.4","@commitlint/config-conventional":"^12.1.4","@types/node":"^15.12.1","html-webpack-plugin":"^5.3.1","husky":"^7.0.1","rollup":"^2.32.0","rollup-plugin-terser":"^7.0.2","standard-version":"^7.0.1","ts-loader":"^9.2.3","typescript":"^4.3.4","vue":"^2.6.10","webpack":"^5.38.1","webpack-cli":"^4.7.0","webpack-dev-server":"^3.11.2"},"standard-version":{"skip":{"tag":true}},"husky":{"hooks":{"commit-msg":"commitlint -E HUSKY_GIT_PARAMS"}},"license":"MIT","gitHead":"e9a988596fa5c89d8b1a5cfaf6e48748d56419e5","bugs":{"url":"https://github.com/daxiazilong/image-preview/issues"},"homepage":"https://github.com/daxiazilong/image-preview#readme","_id":"@daxiazilong/image-preview@2.1.1","_nodeVersion":"14.18.1","_npmVersion":"6.14.15","dist":{"integrity":"sha512-CeLmkHDC+G6zyKKApSw5ttyFHvwZdYpwBKb5cy7GHJkEAWNsxSz/I57z7SMYptVICHDVlc15QZlYCDULVVCR3g==","shasum":"3bb7893e7c6230de2bb2a716f51a5337710201ad","tarball":"https://registry.npmjs.org/@daxiazilong/image-preview/-/image-preview-2.1.1.tgz","fileCount":65,"unpackedSize":1236576,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhyrgrCRA9TVsSAnZWagAAC/kP/1ThC6K9cWgEekxiLebN\nPGlAlZ0pHj0ZApPi8TJDhHdLLReuNLoFvYf/Uh/XjG/iiXi3FZDCUCXZPiKX\nyLSrmQO0AXnNJP+EUSvWfGMrVE1fhgsI9i8JDCDwVs+hSwqSdBKmyGhlV/8B\nWPDR7AgGnC4FSdtMM8LUpSfmRMXrpSbDtMYMjogS/5MUKRIXTvwuDuFg6t3I\nCSKl6CJ7x5LvFqU+l43CfpNlsNkzK+k3Q3NPJ/7lvx9UBrR31b0X6cXPWose\n/ued/fBBBsNKEpmVsHLVlOWmuPKUgFe7r1qgC/ExnPY/6VsWPWPBq0IynkYy\nZDzCKVtEQJmUoZHmUWnzG+/SEUSNSGavG4enC+c4NMCd5/SH1EMdzNq5UWBo\nv1JQOPZ1OytLQVS3vAAhiGh0v2ayrSOPdhhSvsD+ddqRx6TfOIXxWQiLOyU4\nhRZVu0repFOL4Xbn6r3cOYtO2BXDAAsv6SprKhGeyeMsKcxdYTwYQc7VshdC\ns6Ov/0GbMON7H4DQHpH2ctzLdfv/8pEV6guHoJeKSnWbW7ox0lGBOyaV6d3X\nA3xMnGRRvNfKLtD1bsrRYTa7r+yQBz/i/ze0Khc0LZrSJ5JOwFr1TnoruYAA\noXykU8JvWUADBSWeyhmlx1Z+xuGOOFW4+Pwgy1PYQsKpDtVemiC+XNZYeJms\naUIu\r\n=0wsr\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCZtX/mSxmBJznm3k7oOoiL4iR8Upr7toxLCP/3VDr5DwIhAOBoxu42SNIp24Xjdrz1p55TIrjXF23IycXwCNZLRuax"}]},"_npmUser":{"name":"daxiazilong","email":"745629882@qq.com"},"directories":{},"maintainers":[{"name":"daxiazilong","email":"745629882@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/image-preview_2.1.1_1640675371251_0.5280434486068422"},"_hasShrinkwrap":false},"2.1.2":{"name":"@daxiazilong/image-preview","version":"2.1.2","description":"preview image on web page。rotate,zoom.etc. 移动端JS 图片预览 插件 支持 预览图片，旋转，放大(双指/双击)。","keywords":["image preview","viewer","preview image"],"main":"release/image-preview/image-preview-esm-min.js","scripts":{"start":"webpack serve --open Chrome.exe --mode=development","build":"node scripts/beforeBuild.js && npm run genModule","compileTs":"tsc --project ./src","buildTest":"webpack --mode=production","genModule":"./scripts/genModule.sh","release":"standard-version"},"repository":{"url":"git+https://github.com/daxiazilong/image-preview.git"},"author":{"name":"zilong"},"dependencies":{},"devDependencies":{"@commitlint/cli":"^12.1.4","@commitlint/config-conventional":"^12.1.4","@types/node":"^15.12.1","html-webpack-plugin":"^5.3.1","husky":"^7.0.1","rollup":"^2.32.0","rollup-plugin-terser":"^7.0.2","standard-version":"^7.0.1","ts-loader":"^9.2.3","typescript":"^4.3.4","vue":"^2.6.10","webpack":"^5.38.1","webpack-cli":"^4.7.0","webpack-dev-server":"^3.11.2"},"standard-version":{"skip":{"tag":true}},"husky":{"hooks":{"commit-msg":"commitlint -E HUSKY_GIT_PARAMS"}},"license":"MIT","gitHead":"e9a988596fa5c89d8b1a5cfaf6e48748d56419e5","bugs":{"url":"https://github.com/daxiazilong/image-preview/issues"},"homepage":"https://github.com/daxiazilong/image-preview#readme","_id":"@daxiazilong/image-preview@2.1.2","_nodeVersion":"14.18.1","_npmVersion":"6.14.15","dist":{"integrity":"sha512-XxzHh4nydky9K54158pvbo3tCHUlewoWnHK2f/7VIFTZkV97lsg7hlIPx684VzgpbLybcAKdgbo/+jPzD1RASg==","shasum":"32d0896a9669df18444f972103bb04bc0938a93f","tarball":"https://registry.npmjs.org/@daxiazilong/image-preview/-/image-preview-2.1.2.tgz","fileCount":65,"unpackedSize":1236756,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhytJ6CRA9TVsSAnZWagAA98kQAIbjDTcafhczSwx8OEoW\nGdGzNvSDgOvZcf/KXW6f9Kyo/7DGg5FfgiKIJlkSknpkd/3AKLJj7nOHOUQn\nHu7OvfE6+/6sUXRXLzbTN+sVtT3WCoR32d5qmdkSeLhJQ5QqTF0Qy8O7vXxD\ni8z/yMTA3qbcOwHM8/I0TxPKIcp8v8hyLKOtG1VBAoVfhXwTXXrTF9oC1i5b\n/CVhe/JfzfCKze1/3NGW4kX9NjCT7vhN4i50Vz3oik5VSVMp2lrrRISC6OvK\nHIf4AzEwytSE5Er05O15RzC610GNnkSdOlMSc1STvQH/lQFDvI1uiXAnMjBw\np22lwoIhovXTiTK38MAi7iRAeN1FlFYU0sSB8h5OqirjnSVfPrrcQK0lVN+q\nHYnxjDutdnI4U6vrud8a1iYRTn8ns27tU/HNu+CIH1ms4saZz8AhVd2DRkYB\n9c+EjugG7JhM3qSQvC5RKYAQTKromv2p8Kbvd42hz5fgz3/WXBCrD4Qkvi1j\n6YTu+iyPQU5Ctt1znmMetrDDTXl769XDfRmhZQEOMoBCzdtp4VGXeu3RtfdV\nEAkunGKTwBF4TtyKVzq/j62hoRNaC/u9/3pOfLnyc5jcwc2jMdGV1gKADOPI\n136DK6tAjlawhuCRYWTesjWn1+g0CmdYroTikQAN3ZAzSWzgrUIANZ7oCz4x\nakAp\r\n=6kfG\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDqIrQqijxcDgbzk8SRWRAXv4LEWZdPQVUeATYrr1kvXAiEAt/97yDEJPZVgX/FXJfn9I7MALQFHtQlf9ovwrmUcUMA="}]},"_npmUser":{"name":"daxiazilong","email":"745629882@qq.com"},"directories":{},"maintainers":[{"name":"daxiazilong","email":"745629882@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/image-preview_2.1.2_1640682106754_0.4173725274544857"},"_hasShrinkwrap":false},"2.1.3":{"name":"@daxiazilong/image-preview","version":"2.1.3","description":"preview image on web page。rotate,zoom.etc. 移动端JS 图片预览 插件 支持 预览图片，旋转，放大(双指/双击)。","keywords":["image preview","viewer","preview image"],"main":"release/image-preview/image-preview-cjs-min.js","module":"release/image-preview/image-preview-esm-min.js","scripts":{"start":"webpack serve --open Chrome.exe --mode=development","build":"node scripts/beforeBuild.js && npm run genModule","compileTs":"tsc --project ./src","buildTest":"webpack --mode=production","genModule":"./scripts/genModule.sh","release":"standard-version"},"repository":{"url":"git+https://github.com/daxiazilong/image-preview.git"},"author":{"name":"zilong"},"dependencies":{},"devDependencies":{"@commitlint/cli":"^12.1.4","@commitlint/config-conventional":"^12.1.4","@types/node":"^15.12.1","html-webpack-plugin":"^5.3.1","husky":"^7.0.1","rollup":"^2.32.0","rollup-plugin-terser":"^7.0.2","standard-version":"^7.0.1","ts-loader":"^9.2.3","typescript":"^4.3.4","vue":"^2.6.10","webpack":"^5.38.1","webpack-cli":"^4.7.0","webpack-dev-server":"^3.11.2"},"standard-version":{"skip":{"tag":true}},"husky":{"hooks":{"commit-msg":"commitlint -E HUSKY_GIT_PARAMS"}},"license":"MIT","gitHead":"16ea95a6ddccdffe4a724eb3d243808ebf640e07","bugs":{"url":"https://github.com/daxiazilong/image-preview/issues"},"homepage":"https://github.com/daxiazilong/image-preview#readme","_id":"@daxiazilong/image-preview@2.1.3","_nodeVersion":"14.18.1","_npmVersion":"6.14.15","dist":{"integrity":"sha512-8wHXW0CvkZ+CUjGdLGam8VVVFRsXNIcIQ7SLsY+BX1hlGR0fNpbtavMHSbRXOyzAKpNlzZm1i4nZObv9e/PNFw==","shasum":"a99d88c6f40bbed468ed981cfa4f8bb9c406b6f2","tarball":"https://registry.npmjs.org/@daxiazilong/image-preview/-/image-preview-2.1.3.tgz","fileCount":65,"unpackedSize":1236818,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhzAOhCRA9TVsSAnZWagAA7BMP/10XvptkxzbFx2D5Mqti\nKO+R33xKVLyee8Xr1zpxhzgVVNBowNdgYOImhQ/2VQgXf2irtLCadIC3v46/\nXrAAoba+fYIO+FoozDQOCZo+rNoZpQlDx54RF6ilYgmPJElfGb22eC9pkRJi\nvjZB0WOmbZ57dmwccPPJhzFi/t9KVn8vkbOq6VqVVHknpmodAfPToxadcnhL\n5o41pEKFGAHxucG+YcntUEdJEVMgJ19juhB9CDCxsz5TxJGCDp9MVHuhw1C4\nCCPlAdHY8VSVKez50ikfrcdb3qYTX/l0oaZz/7q6HvR4Ftwcu00gOD3b4eoX\ng1nI36xJIgDPJpe20spXTPnMa5vm6rbO3ipYfb/Rb9drG66qbtAmei/L7Uxo\nGNSca4AVweYHPS7kGUI3DioNfBbkGfamhHLOo1evYxKh7mebotM6dLdazw8X\nvXb1STtt2ZZiXGqcWvgx1qe78I2iPvr1uUC4aGyBQnoZmtNc10NCqZMjo7DH\ndlXfyMqzD+AS337KepHl34iSmxDVKEO5/2wa+IdS1wmNl5AD9wKOR+gFrzwn\nr4CbbI4wrWptmVRXmgzs0G9Rga40UfkR+9IeUNRnVb8GWHuUWFf+NWWcjBdJ\n6nF6gh+uNvGRj8HFHTN+Vd1wqIBxgHH81LzdekzwAwdgYngsZmhrmhebq0Ud\n2u5+\r\n=ILc5\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEx+8mdqC2EkQWmwYYdrOrn6JboCyLYLSqCUm0h6Fdd5AiAON/t+Ywj7G5Jqdkkax8P8UUQWYKy+dNhdvcmRrSJFuQ=="}]},"_npmUser":{"name":"daxiazilong","email":"745629882@qq.com"},"directories":{},"maintainers":[{"name":"daxiazilong","email":"745629882@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/image-preview_2.1.3_1640760225728_0.18235348741384416"},"_hasShrinkwrap":false},"2.2.0":{"name":"@daxiazilong/image-preview","version":"2.2.0","description":"preview image on web page。rotate,zoom.etc. 移动端JS 图片预览 插件 支持 预览图片，旋转，放大(双指/双击)。","keywords":["image preview","viewer","preview image"],"main":"release/image-preview/image-preview-cjs-min.js","module":"release/image-preview/image-preview-esm-min.js","types":"release/types/core/image-preview.d.ts","scripts":{"start":"webpack serve --open Chrome.exe --mode=development","build":"node scripts/build.js","compileTs":"tsc --project ./src","buildTest":"webpack --mode=production","genModule":"./scripts/genModule.sh","release":"standard-version"},"repository":{"url":"git+https://github.com/daxiazilong/image-preview.git"},"author":{"name":"zilong"},"devDependencies":{"@commitlint/cli":"^12.1.4","@commitlint/config-conventional":"^12.1.4","@types/node":"^15.12.1","html-webpack-plugin":"^5.3.1","husky":"^7.0.1","rollup":"^2.32.0","rollup-plugin-terser":"^7.0.2","shelljs":"^0.8.5","standard-version":"^7.0.1","ts-loader":"^9.2.3","typescript":"^4.3.4","vue":"^2.6.10","webpack":"^5.38.1","webpack-cli":"^4.7.0","webpack-dev-server":"^3.11.2"},"standard-version":{"skip":{"tag":true}},"husky":{"hooks":{"commit-msg":"commitlint -E HUSKY_GIT_PARAMS"}},"license":"MIT","gitHead":"d61d74e799583b04362b871eeb3096b9565e9850","bugs":{"url":"https://github.com/daxiazilong/image-preview/issues"},"homepage":"https://github.com/daxiazilong/image-preview#readme","_id":"@daxiazilong/image-preview@2.2.0","_nodeVersion":"16.13.2","_npmVersion":"8.1.2","dist":{"integrity":"sha512-A3eC+wT+fcYBgDh4uUkPcvfKMio5Jwdr5pPyPlgn3UyiesvYCXXo8GNOaQJ2AKHGeo8k8W9x3D/l3s3sBwsTyA==","shasum":"8bb39dfaf18251ee9b9a4e457242d7091015084e","tarball":"https://registry.npmjs.org/@daxiazilong/image-preview/-/image-preview-2.2.0.tgz","fileCount":88,"unpackedSize":1580119,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiGGDVACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmo0+g/+LRHwpDDsP8eHh7epfupNa5USWWOJL2q+VmuK9cD0LCy171SK\r\npsc5XigoglIqCjYlCD4A9Ev90BZoN8XbSVB4q1Xx/lXF67HqP2C0a7vrOQVt\r\n2PiVP6HxKCp7QGzgZH45Bv0h531Y5508tbTV+HTXlM71kJv2I+DlolJpCuXx\r\nbbBUdKTB3pdDMDGQOeJWvm8dXGQQlFNMISlSiunTYwbSQlVLcBhqDHHEaq2p\r\nlmijxILx5lcu9BlHL+PAiQa/LkxQnT3gMyxtVc3AkV1ngpQnrd1C4V/CBvdN\r\nfjEW6QswpSoCdFBr3XOcw61mcsN2Gn2plrP4R1Zq+sDQS68O27GRLnVpe8V5\r\nnGzYyjXD3GBkvM4YvAe1gHEew3ah7xmyeEnBt9bRgPHDRdEIwFkJ2a+w4s6P\r\nJVV4EgiCmiVQr5YW1wOuwDSSiAdfjyoLzDxzkRjKR8A869kvMbsza92jwyl5\r\n90tYzqzEvfnbsf1fvjSm1UfkZcLlNMGVg59RzbIg/udm6udy9+cQB1mOvisf\r\n7N0vr9Ptf/t+WQnLMUoHfFelIzlxLE5fOyiCvnOcOzw6tIz520bY4JIrtq8a\r\nZpeeYKYj2HXKwX7OohJkW1iTioCGJdQDHm14xsZBFpbJdlDnY9rWsu/q7ju1\r\n3FmgvQDCz6lpf2dRomzK5y/tgQJjtpp9YoY=\r\n=+Z9I\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCBjpGuAPE6V7wip/BkxelddwCWPWZH5lbU6u/VfiPb4gIgE5cCruyyyd414lQkLhXtUHZgtHW8mveegGf9Jdg0F6Q="}]},"_npmUser":{"name":"daxiazilong","email":"745629882@qq.com"},"directories":{},"maintainers":[{"name":"daxiazilong","email":"745629882@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/image-preview_2.2.0_1645764820952_0.4246843825606543"},"_hasShrinkwrap":false},"2.3.0":{"name":"@daxiazilong/image-preview","version":"2.3.0","description":"preview image on web page。rotate,zoom.etc. 移动端JS 图片预览 插件 支持 预览图片，旋转，放大(双指/双击)。","keywords":["image preview","viewer","preview image"],"main":"release/image-preview/image-preview-cjs-min.js","module":"release/image-preview/image-preview-esm-min.js","types":"release/types/core/image-preview.d.ts","scripts":{"start":"webpack serve --open Chrome.exe --mode=development","build":"node scripts/build.js","compileTs":"tsc --project ./src","buildTest":"webpack --mode=production","genModule":"./scripts/genModule.sh","release":"standard-version"},"repository":{"url":"git+https://github.com/daxiazilong/image-preview.git"},"author":{"name":"zilong"},"devDependencies":{"@commitlint/cli":"^12.1.4","@commitlint/config-conventional":"^12.1.4","@types/node":"^15.12.1","html-webpack-plugin":"^5.3.1","husky":"^7.0.1","rollup":"^2.32.0","rollup-plugin-terser":"^7.0.2","shelljs":"^0.8.5","standard-version":"^7.0.1","ts-loader":"^9.2.3","typescript":"^4.3.4","vue":"^2.6.10","webpack":"^5.38.1","webpack-cli":"^4.7.0","webpack-dev-server":"^3.11.2"},"standard-version":{"skip":{"tag":true}},"husky":{"hooks":{"commit-msg":"commitlint -E HUSKY_GIT_PARAMS"}},"license":"MIT","gitHead":"3cceb876f62a74d8e920a6b7672409f6aa7fb472","bugs":{"url":"https://github.com/daxiazilong/image-preview/issues"},"homepage":"https://github.com/daxiazilong/image-preview#readme","_id":"@daxiazilong/image-preview@2.3.0","_nodeVersion":"14.21.0","_npmVersion":"8.9.0","dist":{"integrity":"sha512-ebhNY2PhqRffNhfqfdV2lmUL54o3zePI1jwekgLCafO4hpsFIfdV7kREvUHfMeukOf0Q/zlwd+0ESMaU0fhMVg==","shasum":"cfc40200fded0c8599181e36bbed3bbb2d76a301","tarball":"https://registry.npmjs.org/@daxiazilong/image-preview/-/image-preview-2.3.0.tgz","fileCount":88,"unpackedSize":1279290,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIB2ewW29dvbQN0i0v0zTa24w/gb3vohKjNNQKxwS6aYUAiAN+TxT0LjAxoGvJK8KdBrotRiE/Wyn2RRr8ei/08RzXA=="}]},"_npmUser":{"name":"daxiazilong","email":"745629882@qq.com"},"directories":{},"maintainers":[{"name":"daxiazilong","email":"745629882@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/image-preview_2.3.0_1689070848982_0.4852333514087108"},"_hasShrinkwrap":false}},"time":{"created":"2021-12-28T07:09:31.184Z","2.1.1":"2021-12-28T07:09:31.423Z","modified":"2023-07-11T10:20:49.358Z","2.1.2":"2021-12-28T09:01:46.963Z","2.1.3":"2021-12-29T06:43:45.895Z","2.2.0":"2022-02-25T04:53:41.151Z","2.3.0":"2023-07-11T10:20:49.237Z"},"maintainers":[{"name":"daxiazilong","email":"745629882@qq.com"}],"description":"preview image on web page。rotate,zoom.etc. 移动端JS 图片预览 插件 支持 预览图片，旋转，放大(双指/双击)。","homepage":"https://github.com/daxiazilong/image-preview#readme","keywords":["image preview","viewer","preview image"],"repository":{"url":"git+https://github.com/daxiazilong/image-preview.git"},"author":{"name":"zilong"},"bugs":{"url":"https://github.com/daxiazilong/image-preview/issues"},"license":"MIT","readme":"ENGLISH | [简体中文](./REAEME-zh-CN.md) \n\n# image-preview\nAn image preview plugin for mobile web application.\n\n### Features:\n1. 🍉 Most operations are supported by gestures.\n2. 🎃 Rotate and zoom image.\n3. 🍓 Img lazy-loading default.\n4. 🍂 Based webgl.\n5. ☄🌰 3D view.\n\"image\"\n\n\n### example\n[click here](https://daxiazilong.github.io/image-preview/index.html) . \n\n### How to use it:\nThere are three ways:\n#### 1. npm install\n```bash \nnpm i @daxiazilong/image-preview\n```\n#### 2. Copy release\n* The `release/image-preview` directory is built for different module-system , include AMD,CommonJS,ES6,UMD,IIFE. You can choose one adapt to your project.\n#### 3.Install:\n* Clone it ,then `npm i & npm run build`\n* For different module-sysetem:\n* The `release/image-preview` directory is built for different module-system , include AMD,CommonJS,ES6,UMD,IIFE. You can choose one adapt to your project.\n\n### import \n * script (in iife or umd module system,use namespace imagePreviewModule):\n ``` html\n \n ```\n * esmodule:\n ```javascript\n import {ImagePreview} from 'js/image-preview-esm.js'\n ```\n or if installed in node_modules\n ```javascript\n import {ImagePreview} from '@daxiazilong/image-preview'\n ```\n#### usage:\nhtml:\n```html\n
\n \n \n
\n```\njavascript:\n``` javascript\n//first way:\nlet imgObj = new ImagePreview({\n selector:`.imageWraper img`\n})\n//second way:\nlet imgObj = new ImagePreview({\n imgs:[\n 'imgsrc',\n 'imgsrc',\n 'imgsrc'\n ]\n})\n//then show n-th picture,use\nimgObj.show(n);\n\n// Distroy image preview instance. Remove HTML generated by this ImagePreview instance and other resources. For better performance, then you can set imgObj = null;\nimgObj.destroy();\n\n```\nThe above code shows two ways about image preview generated, the first way bind click event on the HTMLElement supplied with selector automatically, and the second way requires yourself to bind trigger event manually. Actually, it is very simple, you just call `imgObj.show(n)` in your code where the image preview should open.\n\n#### use with vue:\nHTML:\n```HTML\n\n {{index}}\n\n```\nJS:\n```javascript\nimport {ImagePreview} from '@daxiazilong/image-preview'\nexport default {\n data () {\n return {\n imgs: [\n 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fc-ssl.duitang.com%2Fuploads%2Fitem%2F201909%2F30%2F20190930192812_ZdJUw.jpeg&refer=http%3A%2F%2Fc-ssl.duitang.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1629013294&t=0fefdbd28f9926ff195325bd9d2bd4a9',\n 'https://iknow-pic.cdn.bcebos.com/9213b07eca806538184ec36695dda144ad34821a',\n 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fi0.hdslb.com%2Fbfs%2Farchive%2F1e93e74fb4b87734fb11bc487f9d7e2e9ce666f2.jpg&refer=http%3A%2F%2Fi0.hdslb.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1629028767&t=83072eef6345c4169751cef753b79bd7',\n 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fp.ssl.qhimg.com%2Ft017bbc635928363c05.jpg&refer=http%3A%2F%2Fp.ssl.qhimg.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1629274751&t=89d2696d8027df24bb767e6acb5330ac',\n 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Ff.mgame.netease.com%2Fforum%2F201509%2F21%2F171337o26avxzpb6wpowza.gif&refer=http%3A%2F%2Ff.mgame.netease.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1628907951&t=85efd61fe8604d1fb018b1555e23d316',\n ],\n }\n },\n // for vue3, vue2.x is [beforeDestroy](https://cn.vuejs.org/v2/api/#beforeDestroy)\n beforeUnmount () {\n if (this.imgPreview) {\n this.imgPreview.destroy();\n }\n },\n methods: {\n showImg(index: any) {\n if (!this.imgPreview) {\n this.imgPreview = new ImagePreview({\n imgs: [\n 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fc-ssl.duitang.com%2Fuploads%2Fitem%2F201909%2F30%2F20190930192812_ZdJUw.jpeg&refer=http%3A%2F%2Fc-ssl.duitang.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1629013294&t=0fefdbd28f9926ff195325bd9d2bd4a9',\n 'https://iknow-pic.cdn.bcebos.com/9213b07eca806538184ec36695dda144ad34821a',\n 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fi0.hdslb.com%2Fbfs%2Farchive%2F1e93e74fb4b87734fb11bc487f9d7e2e9ce666f2.jpg&refer=http%3A%2F%2Fi0.hdslb.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1629028767&t=83072eef6345c4169751cef753b79bd7',\n 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fp.ssl.qhimg.com%2Ft017bbc635928363c05.jpg&refer=http%3A%2F%2Fp.ssl.qhimg.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1629274751&t=89d2696d8027df24bb767e6acb5330ac',\n 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Ff.mgame.netease.com%2Fforum%2F201509%2F21%2F171337o26avxzpb6wpowza.gif&refer=http%3A%2F%2Ff.mgame.netease.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1628907951&t=85efd61fe8604d1fb018b1555e23d316',\n ]\n });\n }\n this.imgPreview.show(index);\n }\n },\n}\n```\n \n#### use with React:\n```javascript\n\nexport default() => {\n // a ref \n const imgInstance = useRef(null as unknown as ImagePreview);\n useEffect(()=> {\n return () => {\n if (imgInstance.current) {\n // never forget to destroy\n imgInstance.current.destroy();\n }\n }\n }, [])\n\n const imgs = [\n 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fc-ssl.duitang.com%2Fuploads%2Fitem%2F201909%2F30%2F20190930192812_ZdJUw.jpeg&refer=http%3A%2F%2Fc-ssl.duitang.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1629013294&t=0fefdbd28f9926ff195325bd9d2bd4a9',\n 'https://iknow-pic.cdn.bcebos.com/9213b07eca806538184ec36695dda144ad34821a',\n 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fi0.hdslb.com%2Fbfs%2Farchive%2F1e93e74fb4b87734fb11bc487f9d7e2e9ce666f2.jpg&refer=http%3A%2F%2Fi0.hdslb.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1629028767&t=83072eef6345c4169751cef753b79bd7',\n 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fp.ssl.qhimg.com%2Ft017bbc635928363c05.jpg&refer=http%3A%2F%2Fp.ssl.qhimg.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1629274751&t=89d2696d8027df24bb767e6acb5330ac',\n 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Ff.mgame.netease.com%2Fforum%2F201509%2F21%2F171337o26avxzpb6wpowza.gif&refer=http%3A%2F%2Ff.mgame.netease.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1628907951&t=85efd61fe8604d1fb018b1555e23d316',\n ];\n function handleClick (index: number) {\n if (!imgInstance.current) {\n imgInstance.current = new ImagePreview({\n imgs,\n })\n }\n imgInstance.current.show(index);\n }\n\n return (
\n {\n imgs.map((src, index) => {\n return (\n
handleClick(index)}>\n {index}\n
\n )\n })\n }\n
)\n}\n\n```\n\n### Api\n* `new ImagePreview({imgs?: Array}) ` \n* `new ImagePreview({selector?: string}) ` \n \n Generate an ImagePreview instance.\n* `imagePreview.prototype.show(index:number)` \n Open index-th img on imagepreivew, index starts from 0.\n\n* `imagePreview.prototype.insertImageAfter( image: string | HTMLImageElement , index: number )` \n Insert a new image after index, if index < 0, then a new image will be inserted at 0 position. If the index is greater than imgs' length, the new image will be inserted in the last position.\n * Note: If the param image is HTMLImageElement, and it is cross origin, you'd better set the [crossOrigin](https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/crossOrigin) attribute.\n\n* `imagePreview.prototype.delImage(index:number)` \n Delete index-th image. Index below 0 is 0, greater than imgs's length will be set to the last index.\n\n* `imagePreview.prototype.destroy()` \n Distroy image preview instance. Remove HTML generated by this ImagePreview instance and other resources. For better performance, then you can set imgObj = null;\n \n### communicate\nThanks for your star 😜.\n\nyon can join qq-group 364379192 and chat with me.\n","readmeFilename":"README.md"}