Menu auto-close on click away?

#1

hi all,
i am making a custom menu for use in my wiki and it involves dropdown submenus that expand/collapse on button click.
however, in order to close the submenu you currently need to click the toggle button again.
how can i replicate the behavior of the advancedsearch results popup, closing the submenu automatically when anything (outside of the dropdown) is clicked? i have tried to dig into the advancedsearch tiddler to see how it is done but i can’t wrap my head around it, some help would be appreciated!

the submenus use <div> elements with background fill and relative position css applied to them. they toggle using the <$reveal> widget based on a state field, which is toggled on button click. so, i am looking for a solution which can change a field value when anywhere outside the popup is clicked (but not hog the click like a giant invisible div would do).

thanks!
scribs

#2

Did you try a RevealWidget with type=popup? It has a tc-popup-keep to enforce the opposite of what you want, i.e its default is that it does close when you click outside of it.

#3

this seems like the behavior i am looking for, thanks! however i am having some troubles with loading these dynamically from a list, and using a field value of <<currentTiddler>> in the list as the state tiddler for the popup. i’ll keep trying to work it out!

#4

i figured it out! the trick was to use <$qualify title=<<currentTiddler>> name=qual> to generate state tiddlers for the popup to use (referencing <<qual>> as the state tiddler). thanks for your help :slight_smile: