jQuery Effect Animate() Method
Use
of jquery animate() method for create custom animation in our document.
Custom animated crated by set different type of CSS properties. For
example: size, border size, margin, padding etc. When event is occurs
then properties value will be change. jquery animate() method only work
on numertic value as like (height 500px). Its not work on string value
as like (Color:green).
Syntax
(selector).animate({styles:value})
|
Example
In this example div width size is 100px when we click on button then size will be change 250px.
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#but").click(function () {
$("#abc").animate({ width: "250px" });
});
});
</script>
</head>
<body>
<div id="abc" style="background:blue;height:75px;width:100px;">
</div>
<button id="but">click me</button>
</body>
</html>
|
Output
Before click
After click
You may also want to read these related articles: here
Comments
Post a Comment