A user recently asked me if it was possible to determine the element id when the mouse was hovered over it. This requirement is quite simple using jQuery as demonstrated in the code here:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Find ID on Mouse Hover</title>
<style type="text/css">
.sample
{
height:100px;
width:200px;
border: solid 1px black;
}
</style>
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js">
</script>
<script type="text/javascript">
$(function() {
$('.sample').mouseover(function() {
$('#para').html(this.id);
});
});
</script>
</head>
<body>
<div>
<div id='divOne' class="sample">
DIVONE
</div>
<div id='divTwo' class="sample">
DIVTWO
</div>
<div id='divThree' class="sample">
DIVTHREE
</div>
<br />
<br />
<p id="para" />
</div>
</body>
</html>
See a Live Demo
Bookmark this link on del.icio.us (saved by 0 users)
Did you like this post?
|
|
|
||
|
|
|
|
|
|
|
subscribe via rss |
|
subscribe via e-mail |
|
|
print this post |
|
follow me on twitter |





comments
1 Response to "Determine the Element ID on MouseOver using jQuery"But i dont c a practical usage of it...
Post a Comment