How to Create Effects in JQuery
In this article I have described that how to create effective webpage with help of JQuery.
Effects in JQuery
- To create effective webpage, we use jQuery in our JavaScript code of webpage.
- The jQuery helps us to create the number of effects, such as fading, sliding and animation effect on webpage with help of different kinds of methods.
Lets change the opacity of the color in webpage
Syntax
we can use fade effect as the following way
<script type="text/javascript">
$(document).ready(function () {
$("button").click(function () {
$("div").fadeTo("slow", 0.30);
});
});
</script>
|
NOTE - In above Syntax, fadeTo() method is used to change the opacity of color.
<!DOCTYPE html>
<html>
<head>
<script src="jquery-1.7.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$("button").click(function () {
$("div").fadeTo("slow", 0.30);
});
});
</script>
</head>
<body>
<div style="background:green;width:400px;height:500px">
<button>Fade This Color</button>
</div>
</body>
</html>
|
OUTPUT
When we run it
When we click on button
You may also want to read these related articles here
Ask Your Question
Got a programming related question? You may want to post your question here