Question

I want to display a div over an element (especially a link) when hovered, like in Facebook, when you hover a profile picture.

I know this could be done with JavaScript and CSS but have no exact idea.

Answer 1

Facebook’s approach is to simply use CSS, which won’t work in all browsers. In those browsers Facebook ditches the effect and always shows the element that should only display on hover:

#parent #child {
  display: none;
}
#parent:hover #child {
  display: block;
}

Use conditional CSS to set display: block as the default in IE7 and below.