Thursday, September 26, 2013

Change style of html Tag on mouseenter and mouseleave by Jquery

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Change style of html Tag on mouseenter and mouseleave by Jquery</title>
<style>
p {
color: green;
}
</style>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
<a href="#">Move the mouse over a paragraph.</a>
<a href="#">
Like this one or the one above.</a>
<script>
$( "p" )
.on( "mouseenter", function() {
$( this ).css({
"background-color": "balck",
"font-weight": "bolder"
});
})
.on( "mouseleave", function() {
var styles = {
backgroundColor : "#fds",
fontWeight: ""
};
$( this ).css( styles );
});
</script>
</body>
</html>

No comments:

Post a Comment

Opps Part 1 : Abstraction

  Abstraction in C# is a fundamental concept of object-oriented programming (OOP) that allows developers t...