paintbrush wrote:
Remain Calm.... No need to bash America's favorite fruit
Check this out...
http://www.smashingmagazine.com/2014/02 … ve-design/

Scroll down a bit to get to the calendar part. The author also recommends two different calendar options.

You haven't by any chance seen a solution to the problem with IOS, that they don't support :hover state?

The hover pseudo class only functions on iOS when applied to a link tag. They do that because there is no hover on a touch device reall. It acts more like the active class. So they can't have one unless its a link going somewhere for usability reasons. Change your div to a link tag and you will have no problem.

add this to the element with :hover effect
.myclass { cursor: pointer; }

Despite this, I still absolutely recommend against relying on hover events as a critical method of interaction on mobile devices. To do so is setting yourself up for lots of user headaches. Given the range of different touchscreen browsers and devices, you can’t be certain without a ridiculous level of testing that hover events translate the same way on all of them.

Consequently, my advice is to always assume, regardless of the truth of the statement, that the hover interaction model won’t work for smarthphone and tablet users. This assumption does not however, prevent you from styling the hover selector in all your work and even using some fancy hover effects once in a while. Just keep in mind that the user’s success should not depend on this action, rather it becomes more of a progressive enhancement situation where everyone can use your site at its most basic level and desktop users can enjoy a few visual thrills that touchscreen users might not ever see.