A rather geeky/technical weblog, est. 2001, by Bramus
closest() Method to Capture a “Click outside” an Element
In Practical Use Cases for JavaScript’s closest() Method, Andreas Remdt talks about some nice use cases that use Element.closest(). I especially like this example with a menu. Click on one of the links and it will show the menu which has the class menu-dropdown. Clicking outside said menu will close it. It’s that latter one …
Continue reading “Using JavaScript’s closest() Method to Capture a “Click outside” an Element”
<details> element to create modals and menusThe folks over at GitHub have been leveraging the <details> element to create modals and menus: <details class=“dropdown”> <summary class=“btn” aria-haspopup=“menu”>…</summary> <ul class=“dropdown-content”> <li><a href="/muan">profile</a></li> … </ul> </details> Very clever, as <details> trumps the <modal> element in many ways: Semantic Accessible No JavaScript Next to that, they’ve also released a few custom elements that make …
Continue reading “Using the <details> element to create modals and menus”
The folks who created Codea — an app for creative coding — recently adjusted it to make it also run on the iPhone. While Autolayout tackles most of the screen adapations, they were in need of menus. I realised six months ago as I was using my Mac, using the menus, that I need these …
Continue reading “Create beautiful menus on iOS with Codea’s iOS “Menu” pod”
Yesterday Shaun Inman released version 2 of the aforementioned Day-O for use with the most recent macOS versions. It’s been five years to the day since I released the original Day-O, a simple menu bar clock replacement with a simple icon and an equally simple fly-out calendar for your Mac. So simple. So clever. So …
Not only a good example on how to do it, but also an example on how to do it right: enhance progressively, don’t over-rely on jQuery, and trick your browser into using hardware acceleration where possible Implementing Off-Canvas Navigation For A Responsive Website → Not convinced or 100% about hardware acceleration? Be sure to watch …
Continue reading “Implementing Off-Canvas Navigation For A Responsive Website”
Say hello to the Head-Up Display, or HUD, which will ultimately replace menus in Unity applications. Here’s what we hope you’ll see in 12.04 when you invoke the HUD from any standard Ubuntu app that supports the global menu. To me, this seems: good to keyboarders like me (I’m a fan of QuickSilver/Alfred, shortcuts, etc.) …
You may not know it, but the HTML5 specifications go beyond what we put in the pages and also define how parts of the browser should become available to developers with HTML, CSS and JavaScript. One of these parts of the specs are context menus, or “right click menus”. Using HTML5 and a menu element …