show/hide a div on hover and hover out

Question

I would like to show and hide a div during hover and hover out.

here\'s what I\'ve done lately.

css

Answer 1

You could use jQuery to show the div, and set it at wherever your mouse is:

html:

  
    
    
  

  
    

      
Hover me!
      
Ill show you wonderful things
    
    

     shhhh
    
    
  

styles:

#trigger {
  border: 1px solid black;
}
#secret {
  display:none;
  top:0;  
  position:absolute;
  background: grey;
  color:white;
  width: 50%;
}

js:

$("#trigger").hover(function(e){
    $("#secret").show().css('top', e.pageY + "px").css('left', e.pageX + "px");
  },function(e){
    $("#secret").hide()
})

You can find the example here Cheers! http://plnkr.co/edit/LAhs8X9F8N3ft7qFvjzy?p=preview