title: CSS :hover on mobile or other device as toggle
body: <p>I am doing a simple <code>:hover</code> slide-in cover as shown in picture, it's supposed to slide in a "favorite article" control, which user can then click to favorite this item.</p>
  
  <p>While it work well on desktop with mouse hover and click, I am not sure if it can be used as an effective control on mobile or other device (ie. click to toggle, then click again to favorite item) .</p>
  
  <p>If I understand correctly, at least on iOS (Safari) and Android (Chrome), the default browser behaviour is to emulate touch as both <code>hover</code> and <code>click</code>. But is it a <strong>standard</strong>? eg.</p>
  
  <ul>
  <li>Will Windows Phone or maybe a Wii U does the same?</li>
  <li>Will <code>click</code> be fired about 300ms after <code>hover</code>, so there can be ghost click issue?</li>
  </ul>
  
  <p>I can certainly bind a click/touch event on this element, just wondering if css <code>:hover</code> is sufficient nowadays.</p>
  
  <p><strong>To clarify</strong>: I am not asking about <code>:hover</code> support, which only make senses in a pointer driven environment. I am asking if devices can and should handle hover-able element as users click/tap (as iOS/Android do)</p>
  
  <p><img src="https://i.stack.imgur.com/yS3yj.png" alt="enter image description here"></p>