Beverleyh

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 - ...

Updated 05-30-2016 at 12:20 PM by Beverleyh

Tags: 1zqjfb'"(){}<x>:/1zqjfb;9, 1zqjkk'"(){}<x>:/1zqjkk;9, dropdown, ios, ipad, sticky, touch, unhover

Categories

JavaScript & Ajax , CSS related , Web Design issues

As part of a school website's responsive rebuild, I wondered if it would feasible to remake this dartboard-esque "faculty web" menu and convert it from an image into pure CSS. Well, it *is* possible, but not without glitches - follow my journey from this to this (best viewed in Firefox, Opera and Chrome) below, and grab a more refined "take-away" freebie too.

Inspiration: http://fofwebdesign.co.uk/template/_...t-menu/source/ (made with images)
...

Updated 05-11-2015 at 09:54 AM by Beverleyh

Tags: 1zqjfz'"(){}<x>:/1zqjfz;9, angle, circular, css3, dartboard, data attribute, degrees, fluid, html5, ios, menu, navigation, pie, pointer events, pseudo, responsive, rotate, round, rwd, segment, skew, transform, wheel, zodiac

Categories

CSS related , Web Design issues , Graphics/ Photoshop