Why are use the animate() method in web development?

0 votes
106 views
Ethan Karla asked 28-Jul-2021 in Web Application by Ethan Karla

Why are use the animate() method in web development?

1 Answer

1 votes
Ravi Vishwakarma answered 29-Jul-2021 by Ravi Vishwakarma
jQuery animate()
 If we want to add custom animation on html page. Then we use animate() in jQuery to add animations to the html page. Animate function take some arguments param, speed, callback. The param arguments take the CSS property and speed to define the delay time of the animation. The callback function are optional executes after the animate function is completed.
Syntax

$(selector).animate({params});
$(selector).animate({params}, speed);
$(selector).animate({params}, speed, callback);
The param argument is necessary but speed and callback are optional value.
<!DOCTYPE html>

<html>
<head>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js'></script>
<script>
    $(document).ready(function () {
        $('button').click(function () {
            $('div').animate({
                left: '350px',
                opacity: '0.7',
                height: '250px',
                width: '350px',
                fontSize: '85px',
                top:'150px'
            },1500);
        });
    });
</script>
</head>
<body>
<button>Start Animation</button><br /><br />
<div style='background:#98bf21;height:100px;width:100px;
position:absolute; text-align:center;'>
    Zooming
</div>
</body>
</html>
Why are use the animate() method in web development?