View RSS Feed

Beverleyh

  1. Responsive Multi-Level, Fly-Out Menu

    The earlier version of this menu utilises the same checkbox hack and "off-canvass" pattern in desktop view as it does in mobile - apart from being always-visible on a large screen, it looks and works the same, regardless of what device is accessing it (modern browsers and IE9+).

    Thanks to the increasing popularity of touch devices, where tappable/clickable triggers now seem more favourable than hover actions, this has the benefit of consistency. Minus the initial trigger ...

    Updated 06-04-2014 at 10:43 AM by Beverleyh

    Categories
    CSS related
  2. Responsive Multi-Level, Push/Slide Menu

    I was emailed the other day by somebody asking if my earlier CSS-Only Multi-Level, Off-Canvass Mobile Menu could be visible on desktop too.

    At its most basic level, the following CSS inside of a desktop media query will do that;
    Code:
    #menu { left:0 }
    .container { padding-left:13.75em }
    Except this stumps IE8 and under because of no media query support and no checkbox hack support. So I set to work on creating a version that is visible (and works) on desktop and older browsers. ...

    Updated 05-22-2014 at 06:22 PM by Beverleyh

    Categories
    CSS related