使用CSS淡入/淡出效果

I can't seem to get transition effect working using CSS. I would like to have my drop-down menu fade-in slowinly and fade-out slowly when user clicks. The menu is constructed using ul element and the initial state is hidden. The hidden state is made possible by CSS style and so is visible state. The two styles are toggled using javascript.I can't seem to get transition effect working u