articles

Home / DeveloperSection / Articles / JQuery callback method

JQuery callback method

Sachindra Singh10544 22-Feb-2011

In JQuery callback function will execute when animation effect has finished. Assume that if animation effect applies on image and effect is not finished and execution is reached on next line then in this situation code will generate error, if we want to prevent such type of errors in code then we can use callback method. This method will executed when animation effect has been completed.

Code:
<head>
 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
 
    <script type="text/javascript">
        $(document).ready(function()        {
            $("button").click(function()            {
                $("img").hide(1000, function() //image will hide after animation effect then message will show(callback)
                {
                    alert("Image has hide");
                });
            });
        });
    </script>
</head>
<body>
    <h2>
        JQuery callback method</h2>
    <img src="Lighthouse.jpg" id="img" style="height: 300px; width: 400px; position: relative" />    <br />
    <br />
    <button>
        Click to hide</button>
</body>
</html>

JQuery callback method

If I will click on button,image will start disappear from page as shown below :

JQuery callback method

If image has disappeared from page, popup window will show message on page as shown below:

JQuery callback method



Updated 04-Mar-2020

Leave Comment

Comments

Liked By