{"id":26208124,"url":"https://github.com/dkern/jquery.prefetch","last_synced_at":"2025-12-12T05:57:07.405Z","repository":{"id":29278843,"uuid":"32811574","full_name":"dkern/jquery.prefetch","owner":"dkern","description":"Prefetch is a lightweight image, list and background preloader.","archived":false,"fork":false,"pushed_at":"2020-07-24T11:42:41.000Z","size":14,"stargazers_count":4,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-04-11T21:35:12.473Z","etag":null,"topics":["background-preloader","javascript","jquery","jquery-plugin","jquery-prefetch","prefetch","preload","preload-images","preloader","preloading"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/dkern.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-03-24T16:43:35.000Z","updated_at":"2020-07-24T11:42:43.000Z","dependencies_parsed_at":"2022-08-31T04:23:00.664Z","dependency_job_id":null,"html_url":"https://github.com/dkern/jquery.prefetch","commit_stats":null,"previous_names":["eisbehr-/jquery.prefetch"],"tags_count":3,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dkern%2Fjquery.prefetch","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dkern%2Fjquery.prefetch/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dkern%2Fjquery.prefetch/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dkern%2Fjquery.prefetch/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/dkern","download_url":"https://codeload.github.com/dkern/jquery.prefetch/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248586239,"owners_count":21128997,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["background-preloader","javascript","jquery","jquery-plugin","jquery-prefetch","prefetch","preload","preload-images","preloader","preloading"],"created_at":"2025-03-12T06:19:23.212Z","updated_at":"2025-12-12T05:57:07.368Z","avatar_url":"https://github.com/dkern.png","language":"JavaScript","readme":"## jQuery Prefetch - Lightweight Image and Background Preloader\r\n[![GitHub version](https://badge.fury.io/gh/dkern%2Fjquery.prefetch.svg)](http://github.com/dkern/jquery.prefetch)\r\n[![Dependency version](https://david-dm.org/dkern/jquery.prefetch.png)](https://david-dm.org/dkern/jquery.prefetch)\r\n\r\n---\r\n\r\n## About jQuery Prefetch\r\nPrefetch is a lightweight image, list and background preloader for jQuery. Just give them a list of images or elements and the plugin will load every image for you.\r\n\r\n\r\n## Download \u0026 Installation\r\nFirst of all, you will need [jQuery](http://jquery.com) to use Prefetch successfully on your project! If you get this you can install Prefetch by different ways. Some examples below:\r\n\r\n#### Self-Hosted\r\nDownload and save one of two available files to include Prefetch to your page, either the [development](http://raw.githubusercontent.com/dkern/jquery.prefetch/master/jquery.prefetch.js) or the [minified](http://raw.githubusercontent.com/dkern/jquery.prefetch/master/jquery.prefetch.min.js) version.\r\n```HTML\r\n\u003cscript type=\"text/javascript\" src=\"jquery.prefetch.min.js\"\u003e\u003c/script\u003e\r\n```\r\n\r\n#### Package Managers\r\nPrefetch is even available through [NPM](http://npmjs.org) and [Bower](http://bower.io). Just use one of the following commands below.\r\n\r\n[![NPM version](https://badge.fury.io/js/jquery-prefetch.svg)](http://www.npmjs.org/package/jquery-prefetch)\r\n[![Bower version](https://badge.fury.io/bo/jquery-prefetch.svg)](http://bower.io/search/?q=jquery-prefetch)\r\n\r\n[![NPM](https://nodei.co/npm/jquery-prefetch.png?compact=true)](https://nodei.co/npm/jquery-prefetch/)\r\n```\r\n$ npm install jquery-prefetch\r\n$ bower install jquery-prefetch\r\n```\r\n\r\n\r\n## Load Images or Backgrounds\r\nJust select a bunch of elements with jQuery and pass them to Prefetch, the Plugin does the rest for you:\r\n```HTML\r\n\u003c!-- images --\u003e\r\n\u003cimg src=\"images/1.jpg\" /\u003e\r\n\u003cimg src=\"images/2.jpg\" /\u003e\r\n\u003cimg src=\"images/3.jpg\" /\u003e\r\n\r\n\u003c!-- backgrounds --\u003e\r\n\u003cdiv style=\"background: url(images/1.jpg);\" \u003e\u003c/div\u003e\r\n\u003cdiv style=\"background: url(images/2.jpg);\" \u003e\u003c/div\u003e\r\n\u003cdiv style=\"background: url(images/3.jpg);\" \u003e\u003c/div\u003e\r\n```\r\n```JS\r\n$(\"img, div\").Prefetch();\r\n```\r\n\r\n\r\n## Load a List of Images\r\nPrefetch is even able to load a list of images directly. Pass an array, object or a simple string to load everything:\r\n```JS\r\n$.Prefetch([\"images/1.jpg\", \"images/2.jpg\", \"images/3.jpg\"]);\r\n$.Prefetch([{image: \"images/1.jpg\"}, {image: \"images/2.jpg\"}, {image: \"images/3.jpg\"}]);\r\n$.Prefetch({key1: {file: \"images/1.jpg\"}, key2: {file: \"images/2.jpg\"}}, {objectProperty: \"file\"});\r\n$.Prefetch(\"images/1.jpg\");\r\n```\r\n\r\n\r\n## Use Prefetch the manually way\r\nThe Prefetch-Object can be used in a manual manner or to control its behavior:\r\n```JS\r\n// use public function directly or chained\r\nvar preload = $.Prefetch();\r\npreload.addImage([\"images/1.jpg\", \"images/2.jpg\", \"images/3.jpg\"]);\r\npreload.addImage(\"images/4.jpg\")\r\n       .addImage(\"images/5.jpg\")\r\n       .start();\r\n```\r\n\r\n\r\n## Configuration\r\nThe configuration can be changed directly in the constructor or manually on a Prefetch instance:\r\n```JS\r\n$.Prefetch([\"images/1.jpg\", \"images/2.jpg\", \"images/3.jpg\"], {delay: 1000});\r\n$(\"img, div\").Prefetch({delay: 1000});\r\n\r\nvar preload = $.Prefetch();\r\npreload.configuration.objectProperty = \"file\";\r\n```\r\n\r\n\r\n## Automatically create Image Source\r\nThere will be three possibilies to pass the image source strings to the Plugin. As a simple array/object, with a relative image folder path or within a custom generation function. These examples below will all load the same images:\r\n```JS\r\n// load as simple list\r\n$.Prefetch([\"images/1.jpg\", \"images/2.jpg\", \"images/3.jpg\"]);\r\n\r\n// load with image base path\r\n$.Prefetch([\"1.jpg\", \"2.jpg\", \"3.jpg\"], {imagesBasePath: \"images/\"});\r\n\r\n// load with custom source generation\r\n$.Prefetch([\"1\", \"2\", \"3\"], {getImageSource: function(source) {\r\n\treturn \"images/\" + source + \".jpg\";\r\n}});\r\n```\r\n\r\n\r\n## Parameter\r\nThe following configurations is available by default:\r\n\r\nName               | Type       | Default    | Description\r\n------------------ | ---------- | ---------- | -----------\r\nchainable          | *boolean*  | *true*     | by default Prefetch is chainable and will return all elements, if set to `false` it will return the created plugin instance itself for further use\r\nstartAutomatically | *boolean*  | *true*     | determine to automatically start loading images if available on initialization\r\ndelay              | *integer*  | *0*        | time in milliseconds to wait after initialization before loading images\r\nsimultaneous       | *integer*  | *3*        | amount of images should be loaded simultaneously, zero means no limit\r\nobjectProperty     | *string*   | *\"image\"*  | name of the property of passed object to look for image source\r\nimagesBasePath     | *string*   | *null*     | optional base path where images are located, will be prepend on all image sources\r\nonStartLoading     | *function* | *null*     | optional callback, triggered when loading starts *(parameter: prefetch instance)*\r\ngetImageSource     | *function* | *function* | callback to generate the used image source string, can be overwritten to create a custom source generation *(parameter: image source, prefetch instance / return: string)*\r\nonImageLoaded      | *function* | *null*     | optional callback, triggered when a single image was loaded *(parameter: image source, prefetch instance)*\r\nonImageError       | *function* | *null*     | optional callback, triggered when a single image could not be loaded *(parameter: image source, prefetch instance)*\r\nonAbortLoading     | *function* | *null*     | optional callback, triggered when the loading was aborted while loading with `stop` or `destroy` function *(parameter: prefetch instance)*\r\nonAllLoaded        | *function* | *null*     | optional callback, triggered when all images was loaded *(parameter: prefetch instance)*\r\n\r\n\r\n## Bugs / Feature request\r\nPlease [report](http://github.com/dkern/jquery.prefetch/issues) bugs and feel free to [ask](http://github.com/dkern/jquery.prefetch/issues) for new features directly on GitHub.\r\n\r\n\r\n## License\r\nPrefetch is dual-licensed under [MIT](http://www.opensource.org/licenses/mit-license.php) and [GPL-2.0](http://www.gnu.org/licenses/gpl-2.0.html) license.\r\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdkern%2Fjquery.prefetch","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdkern%2Fjquery.prefetch","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdkern%2Fjquery.prefetch/lists"}