{"_id":"jquery.waitforimages","_rev":"5-5227a58165105be4002206607735744e","name":"jquery.waitforimages","description":"Copyright (c) 2011-2018 Alexander Dickson [@alexdickson](http://twitter.com/alexdickson)","dist-tags":{"latest":"2.4.0"},"versions":{"2.2.0":{"title":"waitForImages jQuery Plugin","main":"./dist/jquery.waitforimages.js","name":"jquery.waitforimages","author":{"name":"Alex Dickson","email":"alex@alexanderdickson.com","url":"http://alexanderdickson.com"},"version":"2.2.0","homepage":"https://github.com/alexanderdickson/waitForImages","bugs":{"url":"https://github.com/alexanderdickson/waitForImages/issues"},"repository":{"type":"git","url":"git+https://github.com/alexanderdickson/waitForImages.git"},"license":"MIT","scripts":{"test":"grunt travis --verbose"},"devDependencies":{"grunt-cli":"~0.1.6","grunt-contrib-jshint":"~0.6.0","grunt-contrib-qunit":"~0.2.2","grunt-contrib-uglify":"~0.2.2","grunt-contrib-concat":"~0.3.0"},"gitHead":"e612f16416229d35a6662e0e24da38b796230099","description":"Copyright (c) 2011-2016 Alexander Dickson [@alexdickson](http://twitter.com/alexdickson)","_id":"jquery.waitforimages@2.2.0","_shasum":"63f23131055a1b060dc913e6d874bcc9b9e6b16b","_from":".","_npmVersion":"3.5.3","_nodeVersion":"5.5.0","_npmUser":{"name":"alexdickson","email":"alex@alexanderdickson.com"},"dist":{"shasum":"63f23131055a1b060dc913e6d874bcc9b9e6b16b","tarball":"https://registry.npmjs.org/jquery.waitforimages/-/jquery.waitforimages-2.2.0.tgz","integrity":"sha512-GB59lLxKFL4P1wxMfpzkZokhoImX+eEk0+8aesvBG5GUsL3jsM8hVSu9Zgg7M/1aEG9OHQAKA+Xu0jKyx03mOQ==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCnnHBigTAkH5YHko/mXuqVuFNco9yZ8YzDbUS2u+MDSwIhAL1TN/w7Lx6Jb2mFlRqj/ABiqyTs3oXMNARbeh3zGSe7"}]},"maintainers":[{"name":"alexdickson","email":"alex@alexanderdickson.com"}],"_npmOperationalInternal":{"host":"packages-12-west.internal.npmjs.com","tmp":"tmp/jquery.waitforimages-2.2.0.tgz_1465158444187_0.5520643971394747"},"directories":{}},"2.4.0":{"title":"waitForImages jQuery Plugin","main":"./dist/jquery.waitforimages.js","name":"jquery.waitforimages","author":{"name":"Alex Dickson","email":"alex@alexanderdickson.com","url":"http://alexanderdickson.com"},"version":"2.4.0","homepage":"https://github.com/alexanderdickson/waitForImages","bugs":{"url":"https://github.com/alexanderdickson/waitForImages/issues"},"repository":{"type":"git","url":"git+https://github.com/alexanderdickson/waitForImages.git"},"license":"MIT","scripts":{"test":"grunt travis --verbose"},"devDependencies":{"grunt":"^1.0.1","grunt-cli":"~1.2.0","grunt-contrib-concat":"~1.0.1","grunt-contrib-jshint":"~1.1.0","grunt-contrib-qunit":"~1.3.0","grunt-contrib-uglify":"~2.1.0"},"gitHead":"5d0c0a59ee8279c23143503269275f79fe8c5aec","description":"Copyright (c) 2011-2018 Alexander Dickson [@alexdickson](http://twitter.com/alexdickson)","_id":"jquery.waitforimages@2.4.0","_npmVersion":"5.6.0","_nodeVersion":"8.9.4","_npmUser":{"name":"alexdickson","email":"alex@alexanderdickson.com"},"dist":{"integrity":"sha512-GmkE2wf2vUlg+XayDq0bfUtsn/Wq7FIX1NjnOtMjl63goz/PKj7787RoTJXQx6XAaZAO3TQ3QoLfLwWsaDKOhQ==","shasum":"6bb6d84937bbaf742033031444bbc9f0db6ccd65","tarball":"https://registry.npmjs.org/jquery.waitforimages/-/jquery.waitforimages-2.4.0.tgz","fileCount":16,"unpackedSize":354249,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD2bUJUkJweNNqh1WNOMTv2BW2sUTaM3Ave/uKsJQdpqAIhAOr9jy9W7NeoFIm/jbIuoCkuI4baXD+iqioSd8kVvnoP"}]},"maintainers":[{"name":"alexdickson","email":"alex@alexanderdickson.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/jquery.waitforimages_2.4.0_1518539751354_0.5059017910508856"},"_hasShrinkwrap":false}},"readme":"# waitForImages\n\nCopyright (c) 2011-2018 Alexander Dickson [@alexdickson](http://twitter.com/alexdickson)\n\nLicensed under the [MIT licenses](https://raw.github.com/alexanderdickson/waitForImages/master/LICENSE-MIT).\n\n[http://alexanderdickson.com](http://alexanderdickson.com)\n\n[Donate!](http://paypal.me/alexwilliamdickson)\n\n\n[![Build Status](https://secure.travis-ci.org/alexanderdickson/waitForImages.svg)](http://travis-ci.org/alexanderdickson/waitForImages)\n\n## Overview\n\nProvides useful callbacks once descendant images have loaded.\n\nwaitForImages also supports both images referenced in CSS, such as the `background-image` property, and images referenced in element attributes such as `srcset`. Images referenced in attributes can also be a comma-separated list of images.\n\nIt can be useful when WebKit incorrectly reports element dimensions/offsets on document ready, because it has not calculated their descendant `img` dimensions yet.\n\nSupports all browsers you probably care about.\n\n## Get it\n\nYou can either grab the source yourself...\n\n- [Production (minified)](https://raw.github.com/alexanderdickson/waitForImages/master/dist/jquery.waitforimages.min.js)\n- [Development (unminified)](https://raw.github.com/alexanderdickson/waitForImages/master/dist/jquery.waitforimages.js)\n\n...or you can use a hosted version...\n\n- [Hosted on CDNJS (minified)](http://cdnjs.cloudflare.com/ajax/libs/jquery.waitforimages/1.5.0/jquery.waitforimages.min.js)\n\nAlternatively, you can install with [`bower`](http://bower.io/)...\n\n```bash\nbower install waitForImages\n```\n\n...or [`npm`](https://www.npmjs.com/)...\n\n```bash\nnpm install jquery.waitforimages\n```\n\nOf course, these need to be loaded after `jQuery` is made available. The current version should be supported by at least jQuery 1.8, or perhaps earlier. If you find incompatibility issues, please check out a previous tagged version.\n\n## Usage\n\nThere are two ways to use waitForImages: with a standard callback system (previously the only API) or receiving a promise.\n\n### Standard\n\nJust provide a callback function and it will be called once all descendant images have loaded.\n\n```javascript\n$('selector').waitForImages(function() {\n    // All descendant images have loaded, now slide up.\n    $(this).slideUp();\n});\n```\n\nYou can also use the jQuery promise API.\n\n```javascript\n$('selector').waitForImages().done(function() {\n    // All descendant images have loaded, now slide up.\n    $(this).slideUp();\n});\n```\n\nIn the callbacks, `this` is a reference to the collection that `waitForImages()` was called on.\n\n### Advanced\n\nYou can pass a second function as a callback that will be called for each image that is loaded, with some information passed as arguments.\n\n```javascript\n$('selector').waitForImages(function() {\n    alert('All images have loaded.');\n}, function(loaded, count, success) {\n   alert(loaded + ' of ' + count + ' images has ' + (success ? 'loaded' : 'failed to load') +  '.');\n   $(this).addClass('loaded');\n});\n```\n\nUsing the jQuery promises API, you can then use the `progress()` method to know when an individual image has been loaded.\n\n```javascript\n$('selector').waitForImages().progress(function(loaded, count, success) {\n   alert(loaded + ' of ' + count + ' images has ' + (success ? 'loaded' : 'failed to load') +  '.');\n   $(this).addClass('loaded');\n});\n```\n\nYou can also set the third argument to `true` if you'd like the plugin to iterate over the collection and all descendent elements, checking for images referenced in the CSS (by default, it looks at the `background-image`, `list-style-image`, `border-image`, `border-corner-image` and `cursor` properties). If it finds any, they will be treated as a descendant image.\n\nThe callback will be called on the successful **and** unsuccessful loading of the image. Check the third argument to determine the success of the image load. It will be `true` if the image loaded successfully.\n\nIf you want to skip the first argument, pass `$.noop` or alternatively, pass an object literal to the plugin, instead of the arguments individually.\n\n```javascript\n$('selector').waitForImages({\n    finished: function() {\n        // ...\n    },\n    each: function() {\n       // ...\n    },\n    waitForAll: true\n});\n```\n\nTo use this with the promise API, simply pass one argument, which is `waitForAll`.\n\n```javascript\n$('selector').waitForImages(true).done(function() {\n    // ...\n});\n```\n\nYou may also set the CSS properties that possibly contain image references yourself. Just assign an array of properties to the plugin.\n\n```javascript\n$.waitForImages.hasImgProperties = ['backgroundImage'];\n```\n\nwaitForImages also exposes two custom selectors, `img:has-src` and `img:uncached`, (both used in conjunction with the `img` selector), which allow you to select `img` elements with a valid `src` attribute or that are not already cached already by the browser, respectively.\n\n```javascript\n$('img').not(':has-src').remove();\n$('img:uncached').attr('title', 'Loading Image');\n```\n\n## Feedback\n\nPlease use the [Issues](https://github.com/alexanderdickson/waitForImages/issues) for any bugs, feature requests, etc.\n\nIf you're having problems using the plugin, [ask a question on Stack Overflow](http://stackoverflow.com/questions/tagged/waitforimages).\n","maintainers":[{"name":"alexdickson","email":"alex@alexanderdickson.com"}],"time":{"modified":"2022-06-19T05:25:24.623Z","created":"2016-06-05T20:27:26.419Z","2.2.0":"2016-06-05T20:27:26.419Z","2.4.0":"2018-02-13T16:35:52.323Z"},"homepage":"https://github.com/alexanderdickson/waitForImages","repository":{"type":"git","url":"git+https://github.com/alexanderdickson/waitForImages.git"},"author":{"name":"Alex Dickson","email":"alex@alexanderdickson.com","url":"http://alexanderdickson.com"},"bugs":{"url":"https://github.com/alexanderdickson/waitForImages/issues"},"license":"MIT","readmeFilename":"README.md"}