In jQuery css () method is very useful. By using this method we can change style of elements. In this article I am trying to show you, how we can apply css method on web page. By using this method we can define element style, format, height or width etc. In this example <div>element contain text and I want to change font color of text by using css () method. In the page when button is clicked then css of <div> tag is changed as shown by following example
Syntax:
- (“target”).css (“keyname”);
- (“target”).css (“keyname”, value”);
- (“target”).css({properties});
Code:
<head>
<title>jQuery css method</title>
<script type="text/javascript" src="jquery.min.js"> </script>
<script type="text/javascript">
$(document).ready(function() {
$("button").click(function() {
$("div").css("color","blue");//when button is clicked css will apply on <div> element
});
});
</script>
</head>
<body>
<div style="width:300px;height:100px;position:relative"> <!--div element contain some text-->
JQuery is a library that makes it quicker and easier
to build JavaScript webpages and web application.
</div>
<button>
Blue font
</button>
</body>
</html>
Screenshot
If I will click Blue font button then it will change font color of <div> control as shown below:
Screenshot
Leave a Comment
1 Comments