Make scrollbars only visible when a Div is hovered over?

Question

I am trying to figure out how to have a scrollable div that only shows its scrollbars when Hovered.

Example is Google Image search, in the image below you can see

Answer 1

If you are only concern about showing/hiding, this code would work just fine:

$("#leftDiv").hover(function(){$(this).css("overflow","scroll");},function(){$(this).css("overflow","hidden");});

However, it might modify some elements in your design, in case you are using width=100%, considering that when you hide the scrollbar, it creates a little bit of more room for your width.