Here I will explain how to use jQuery to change image opacity on mouseover using jQuery or change opacity of image on hover using jQuery.
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery Change Image Opacity on Mouse Over</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript">
$(function() {
$("#logoimage").css("opacity", 0.5);
$("#logoimage").hover(function() {
$(this).animate({ opacity: 1.0 }, 500);
}, function() {
$(this).animate({ opacity: 0.5 }, 500);
});
})
</script>
</head>
<body>
<form id="form1">
<div>
<img id="logoimage" src="FinalLogo.png" />
</div>
</form>
</body>
</html>
jQuery Change Opacity of Image on Mouseover
No comments:
Post a Comment