jQuery and ASP.NET

January 7, 2010

Determine the Element ID on MouseOver using jQuery




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?
kick it on DotNetKicks.com
subscribe via rss subscribe via e-mail
print this post follow me on twitter
Others Also Read..

comments

1 Response to "Determine the Element ID on MouseOver using jQuery"
  1. Jaan said...
    January 7, 2010 9:39 AM

    But i dont c a practical usage of it...

 

Copyright 2010 All Rights Reserved DevCurry.com by Suprotim Agarwal