Web
Analytics
Jquery Bind Method with optional data attribute example | Angular | ASP.NET Tutorials

For Consultation : +91 9887575540

Stay Connected :

In Jquery data sending into function object “e” is optional. Here I am sending border color as data.Download Source Code

<!DOCTYPE html>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<title></title>
<script src=”Scripts/jquery-2.2.3.js”></script>
<script>
$(document).ready(function () {
$(“img”).bind(“mouseenter”,”yellow”, fnof_mouseenter).bind(“mouseout”,”red”, fnof_mouseout);

function fnof_mouseenter(e) {
if (e.type == “mouseenter”) {
$(this).css({ “opacity”: “0.5”, “border”: “2px solid “+e.data });
}
if (e.type == “click”) {
$(this).css({ “width”: “500px”, “height”: “500px” });
}

}
function fnof_mouseout(e) {
$(this).css({ “opacity”: “”, “border”: “”, “width”: “”, “height”: “”, “border”: “2px solid “+e.data });
}
});

</script>
</head>
<body>
<img src=”Images/man1.jpg” />
<img src=”Images/man2.jpg” />
<img src=”Images/man3.jpg” />
<img src=”Images/women.jpg” />
</body>
</html>