javascripthtmlcssmultimedia

Onmouseover for a Button to show a description box

I would like a little text box to pop up and remain up until there is no onmouseover for that button anymore.

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

Thanks a lot :)

Solution

  • Using javascript..(next time make an attempt :D)

    function in_out(e){
if(e.type=='mouseover'){
	document.getElementById('textbox').style.display='inline';
  }
else if(e.type=='mouseout'){
	document.getElementById('textbox').style.display='none';
	}
}


document.getElementById('button').addEventListener('mouseover',in_out,false)
document.getElementById('button').addEventListener('mouseout',in_out,false)
    #textbox {
  width:100px;
  display:none;
}
    <input type='text' id='textbox'>
<br>
<button id='button'>
hover here
</button>