Question

I am trying my luck at creating my own kind of menus using css and jquery. So far, I have the basics in place where the dropdown works and displays the results.

I have a problem however in that if I have 2 menus close to each other, I can’t seem to get the desired effect of the currently selected menu being above the other menu.

Its a little tricky to explain, and show all the code in here, so I’ve got a working example at jsfiddle.

I’ve tried making the z-index of the currently visible .selections to be higher than the .please_select but this seems to have no effect.I clearly don’t understand something about CSS! 🙁

Any ideas? click here

Note when you click the first ‘please select’ that its options appear under the second ‘please select’

Answer 1

Remove your z-indexes from #time_selection_b and #ticket_option_selection. They’re higher than the menu’s z-index, which means they’ll appear in front of it.