Mobile platforms such as iOS Safari have this way of deciding if a link should get one or two clicks before it's followed. Here's an example.
<ul> <li> <a href="#">Top</a> <ul> <li><a href="#">Sub</a></li> </ul> </li> </ul>
Depending upon how your hovers are set up, iOS might require two clicks on Top and one on Sub.
Does anyone know a direct way of controlling this? I have a case where leaving it up to the automatic settings isn't working the way I want it to.
If the link has a hover state it will require two clicks.
If you don't want two clicks, make sure that your mobile visitors don't get a hover state.
Good call Doc. It's that simple, eh?
Anyone know how to achieve this for tablet device only? thanks
This is old but in case anyone was wondering:
if ("ontouchstart" in document.documentElement) { $(document).ready(function () { $('.class-with-hover').click(function () { $(this).children('ul').slideToggle(); }); }); } //end dropdown click menu touch
Mobile platforms such as iOS Safari have this way of deciding if a link should get one or two clicks before it's followed. Here's an example.
<ul> <li> <a href="#">Top</a> <ul> <li><a href="#">Sub</a></li> </ul> </li> </ul>Depending upon how your hovers are set up, iOS might require two clicks on Top and one on Sub.
Does anyone know a direct way of controlling this? I have a case where leaving it up to the automatic settings isn't working the way I want it to.
If the link has a hover state it will require two clicks.
If you don't want two clicks, make sure that your mobile visitors don't get a hover state.
Good call Doc. It's that simple, eh?
Anyone know how to achieve this for tablet device only? thanks
This is old but in case anyone was wondering: