Introduction:
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.Here is the aspx code with the jQuery function.
<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="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJyV9uXDRC1UmF-EQ41rhDHVaTYkw5SbI9-L2CBRsODFY_Rt9Iue4BhyjKg0GqNgz0JTsubQQ5rxr8LMhCwda44MXaYh2PQoZJrx1VlyhZI2AMJBNLxk1EwjOL74NvkZ4HC_RijQj9VWs/s1600/aavv.JPG"
/>
</div>
</form>
</body>
</html>
No comments:
Post a Comment