Hi Steve, Thanks for that, the question in the call was about a CSS-only version which doesn’t use a script. E.g. https://csswizardry.com/2011/02/creating-a-pure-css-dropdown-menu/ Demo page: https://csswizardry.com/demos/css-dropdown/ There is a tendency for some devs to prefer a non-JS version if possible, but some do note the accessibility issues (even prior to WCAG 2.1) https://purecss.io/menus/#dropdowns Without a JS handler for key presses I don’t see a method of activating on :hover and being dismissible? Even the button-within trigger area would need JS. For the tooltip example (e.g. Bootstrap<https://getbootstrap.com/docs/4.1/components/tooltips/>) that’s added with JS so I think it would be fairly straightforward to add a window event that toggles the tooltips. Detlev – If you are using JavaScript you can attach a window-level event that could close any hover content that’s open. I’m not very strong with JS, but for example you could add a class of ‘open’ to any block that is shown on hover (by JS). The window event could then find all those elements and hide them. In general I think you’d want to put that sort of function into the widget (e.g. the drop-down menus), rather than have a generic function for that. Unless you use a lot of hover content! A positive technique would be useful, perhaps starting with Steve’s example, or something similar to Heydon’s tooltips? https://inclusive-components.design/tooltips-toggletips/ Cheers, -Alastair
Received on Tuesday, 28 August 2018 22:07:47 UTC