Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 642
  • Last Modified:

CSS Drop-Down Menu with "Click to Open"

Does anyone have any examples of a CSS Drop Menu (or javascript if necessary) that uses "click to open"? I basically want a drop down that behaves like a combobox. The problem is, my drop down menu is fancy and I don't see any easy way to reskin a combobox to do what i'm attempting. Please see "Example.jpg" attached for clarification. The closest i could find to what i need is here:
http://www.cssmenumaker.com/builder/menu_info.php?menu=007

The main difference is that this works on a hover and not a click to open. Also it does not remain expanded until you click away (i.e.: just like a combobox). If I could at least get the hover and 'click to open' part to work right that would help alot. Any ideas on how to best accomplish this behavior would be greatly appreciated.
Example.jpg
0
VirtualLNK
Asked:
VirtualLNK
  • 3
  • 2
1 Solution
 
slovisaCommented:
This one has worked well for me. Let me know what you think. (Remove ".txt" - this is an HTML file.)
click-menu.html.txt
0
 
VirtualLNKAuthor Commented:
Thanks for this, although it's not quite what I need. I need the hyperlink to maintain it's hover style while the menu is expanded (see Example.jpg) and to go away when I click away from it.
0
 
slovisaCommented:
How good are you with Javascript? I found a good script that I'm thinking you could modify - replacing the onmouseover to onclick (to open the menu); and replacing the onmouseout with an onblur function (to close the menu when another top-level item is clicked).

Here's the menu script:
http://www.darrenkrape.com/fun/journal/drop-down-menus-persistent-top-level-menu-styling/ 

And here's some help with the onblur function:
http://forums.devshed.com/javascript-development-115/javascript-popup-menu-needs-to-close-when-u-click-off-585959.html

JS is not my strong suit or I'd try to hack it together for you...but I think all the pieces are there. :)
0
 
VirtualLNKAuthor Commented:
It took some work, but I was able edit the second example to achieve what i needed. Thanks for your help slovisa.
0
 
VirtualLNKAuthor Commented:
Thanks for your help!
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now