On some mouse over, div1 is displayed.How to display the div next to the mouse pointer so that even mouseover at the end of the context the div should show up next to the mouse pointer.
<style type="text/css">
#div1 { width: 200px; height: 30px; background-color: #a9a9a9; color: #fff; position: absolute; }
</style>
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$(window).mouseover(function(event){
$("#div1").css({'top': event.pageY, 'left': event.pageX});
});
});
</script>
<div id="div1">mouseover me</div>
This might help: http://webdevpad.blogspot.com/2010/07/cross-browser-mouse-coordinates.html
Once you get the mouse position, give it a small offset, pass the coordinates to your tooltip div, and remember to give your tooltip position:fixed.