:-moz-system-metric(touch-enabled) sembra un utile selettore CSS per lavorare su siti mobili.Equivalente Webkit di: -moz-system-metric (touch-enabled)
Sfortunatamente Webkit è dominante sui dispositivi touch mobili, quindi qualcuno sa se esiste un equivalente Webkit?
(Idealmente Sarebbe bello se questo è stato gestito da media query CSS3)
Edit:Looks like it is supported in Gecko as a media query
Chrome è un altro browser che ha provato a implementare un selettore di simile, ma purtroppo è stato rimosso fuori per adesso.
Modernizr potrebbe essere uno strumento di rilevamento interessante poiché è in grado di rilevare anche gli eventi di tocco.
Non c'è modo per ottenere questo risultato senza ricorrere a Javascript, allo stato attuale.
Come ha detto @easwee, Modernizr è una libreria JS ben studiata che si concentra sul rilevamento di funzionalità. Puoi utilizzare il test touch per il tuo caso d'uso.
Se non avete bisogno di tutte le campane e fischietti di Modernizr, è possibile effettuare le seguenti operazioni:
A) Caricare il seguente JS già nel tag <body>, come si può:
<script type="text/javascript">
if(!!window.TouchEvent) body.className += " touch-enabled ";
</script>
B) Scrivi il tuo CSS. Dal momento che Gecko utilizza una media query per informarti di disponibilità contatto, dovrete ingannare il CSS specifica-touch, in questo modo:
BODY.touch-enabled DIV.foo
{
/* touch-specific CSS */
}
@media screen and (-moz-touch-enabled)
{
DIV.foo
{
/* touch-specific CSS */
}
}
Se il codice per-selettore è identico in entrambe le circostanze, GZIP dovrebbe ottimizzare via parte della duplicazione. (Stai usando la compressione, spero.)
Nella risposta di Ian Wessman il test !!window.TouchEvent funziona in modo errato. Nel desktop attuale Chrome (23.0.1271.52, Linux) window.TouchEvent è una funzione, quindi il codice di Ian considera il browser abilitato al tocco.
Se si desidera un codice funzione, è preferibile copiare e incollare lo relevant code from Modernizr.
https://github.com/Modernizr/Modernizr/blob/master/feature-detects/touchevents.js – eimaj