Javascript Question

description box on mouseover

I am playing with the

event in javascript

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

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..?

Answer Source

Assuming popup is the ID of your "description box":


<div id="parent">
This is the main container.
<div id="popup" style="display: none">some text here</div>


var e = document.getElementById('parent');
e.onmouseover = function() {
  document.getElementById('popup').style.display = 'block';
e.onmouseout = function() {
  document.getElementById('popup').style.display = 'none';

Alternatively you can get rid of JavaScript entirely and do it just with CSS:


#parent #popup {
  display: none;

#parent:hover #popup {
  display: block;
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download