Is it possible to detect when images are loaded via a jQuery event?

jQueryWeb DevelopmentFront End Technology

To detect loading of an image with jQuery, use the load() event handler.

Note: The load() method deprecated in jQuery version 1.8. It was completely removed in version 3.0. To see its working, add jQuery version for CDN before 3.0.

Example

You can try to run the following code to learn how to detect when image loads:

Live Demo

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("img").load(function(){
        alert("Image successfully loaded.");
    });
});
</script>
</head>
<body>

<img src="/videotutorials/images/tutor_connect_home.jpg" alt="Tutor" width="304" height="236">

<p><strong>Note:</strong> The load() method deprecated in jQuery version 1.8. It was completely removed in version 3.0. To see its working, add jQuery version for CDN before 3.0.</p>

</body>
</html>
raja
Published on 20-Dec-2017 07:53:07
Advertisements