Is there any way to prevent page load of images with javascript?

Question

I'd like to build a lazy loading plugin. Some resources have indicated that as soon as a src is defined on an image, the browser begins to load it. At what point in page processing does this happen? Is it possible to code in some javascript that prevents this from happening?

Answer 1

If I understood correctly that you do not want to load an image until the user interacts somehow, this is what you might be looking for.

Jsfiddle: http://jsfiddle.net/z2kgpL37/

<img id="myImg" src="" width="107" height="98">


<button onclick="myFunction()">Load image</button>

<script>
function myFunction() {
    document.getElementById("myImg").src = "http://www.w3schools.com/jsref/compman.gif";
}
</script>

If this helped, accept the answer :)