JavaScript transition with the display property?

Question

Can I make a certain element fade in when I hover over another one, and make it fade out when my mouse isn\'t on the element anymore?

I tried adding a transition

Answer 1

Here's a pure css solution for your specific html:

fiddle

html

for the css I used opacity instead of display and added the following:

css

#button:hover ~ #menu,
#menu:hover {
    opacity:1;
    height:100px;
}