View RSS Feed

Beverleyh

  1. iOS 'Sticky Hover' Fix - Unhovering dropdown CSS menus

    One line of JavaScript to fix the 'sticky hover' problem on iOS; Where hover CSS isn't removed from an active element until another focusable element (button, link) is clicked. With this script, a tap of the surrounding area will remove hover CSS.

    What's the problem?
    In the opening paragraph, I state that a problem with hover activated CSS on iOS is that hover styles aren't removed until another element takes focus. A notable case for this is with CSS-only dropdown menus - ...
  2. Add 'Swipe Support' to your website (RWD CSS3 Any Content Slider demo)

    Let visitors 'feel' their way around the interactive areas of your website by adding support for native swipe gestures on touch devices. I'll be using my earlier RWD CSS3 Any Content Slider (JS auto-play) as a demo, but you can easily take away from this post to add touch gestures to your own apps... Need some other ideas?

    Website features that may benefit from a left or right swipe;
    - a content slider (progress back and forth between slides)
    - an image gallery (progress ...
  3. Beat the 300ms Delay on Touch, and Close Sub-Menus

    One of the most annoying things on touch devices is the way that CSS hover activated menus stay open until another link is clicked. Well, this example fixes that;

    UPDATED! Responsive CSS3 Multi-Level, Drop-Down Menu

    (Earlier releases of the Drop-Down menu have been replaced with better support for tap-activated sub-menus on touchscreen - reverted to using the arrow labels and checkbox hack [like the Fly-Out version does] - they're there for mobile view so why not use ...