[javascript] Description Box using "onmouseover"

I am playing with the onmouseover event in javascript

I would like a little box to pop up and remain up until there is no onmouseover anymore

I think it's called a description box, but I am not sure.

How do I get a little box to pop up with custom text when I put my mouse over certain text, and disappear once I move the mouse to a different object..?

The CSS Tooltip allows you to format the popup as you like as any div section! And no Javascript needed.

This an old question but for people still looking. In JS you can now use the title property.

button.title = ("Popup text here");

Although not necessarily a JavaScript solution, there is also a "title" global tag attribute that may be helpful.

<a href="https://stackoverflow.com/questions/3559467/description-box-on-mouseover" title="This is a title.">Mouseover me</a>

Mouseover me

Well, I made a simple two liner script for this, Its small and does what u want.

Check it http://jsfiddle.net/9RxLM/

Its a jquery solution :D

I'd try doing this with jQuery's .hover() event handler system, it makes it easy to show a div with the tooltip when the mouse is over the text, and hide it once it's gone.

Here's a simple example.

HTML:

?<p id="testText">Some Text</p>
<div id="tooltip">Tooltip Hint Text</div>???????????????????????????????????????????

Basic CSS:

?#?tooltip {
display:none;
border:1px solid #F00;
width:150px;
}?

jQuery:

$("#testText").hover(
   function(e){
       $("#tooltip").show();
   },
   function(e){
       $("#tooltip").hide();
  });??????????