SOURCE

$(function(){
	$('#longtext').attr('style','text-overflow:ellipsis;white-space:nowrap;width:12em;overflow:hidden;')
  $('#longtext').hover(function(){
        this.style.overflow='visible'
  },function(){
        this.style.overflow='hidden'
  })
})

<div id='longtext'>This is some long text that will not fit in the box</div>

div.test
{
white-space:nowrap; 
width:12em; 
overflow:hidden; 
border:1px solid #000000;
}