load only visible images via jquery
JavaScript
Switch branches/tags
Nothing to show
Pull request Compare This branch is 2 commits behind galaxycats:master.
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
example
README.md
jquery.load-visible-images.js

README.md

jQuery plugin - loadVisibleImages

Usage

Just put

<script src="jquery.load-visible-images" type="text/javascript"></script>

in you HTML-Head.

Now you can call loadVisibleImages() on any jQuery-Object.

Example

<div id="scrollable-div-container">
  <img src="loading-image.gif" data-img-src="the-real-image-src.jpg">
  <img src="loading-image.gif" data-img-src="the-real-image-src.jpg">
  <img src="loading-image.gif" data-img-src="the-real-image-src.jpg">
  <img src="loading-image.gif" data-img-src="the-real-image-src.jpg">
</div>

<script type="text/javascript" charset="utf-8">
  $(document).ready(function() { $('#scrollable-div-container').loadVisibleImages(); });
</script>

So if you div-container is smaller than the images to display and a scrollbar appears, all images will only be loaded if they are visible.