Bagaimanakah Saya Boleh Mengesan Peranti Skrin Sentuh lwn. Bukan Skrin Sentuh dalam Pembangunan Web?

Pengesanan Skrin Sentuh dengan Pertanyaan Media

Dalam bidang pembangunan web, selalunya menjadi perlu untuk menyesuaikan kandungan atau tingkah laku berdasarkan keupayaan input daripada peranti pengguna. Satu perbezaan biasa ialah antara skrin sentuh dan peranti bukan skrin sentuh.

Penyelesaian Pertanyaan Media:

Draf pertanyaan media CSS4 memperkenalkan sifat 'penunjuk' untuk menangani keperluan ini.

@media (pointer: none) {
  /* Non-touchscreen device styling */
}

• 'tiada': Tiada peranti penunjuk tersedia (cth., desktop)
• 'kasar': Ketepatan peranti penunjuk terhad (cth., pad jejak)
• 'halus': Peranti penunjuk tepat ( cth., skrin sentuh)

Walau bagaimanapun, adalah penting untuk ambil perhatian bahawa keserasian penyemak imbas untuk sifat ini adalah terhad.

Penyelesaian JavaScript Ganti:

Jika sokongan untuk ciri media 'penunjuk' tidak mencukupi, pertimbangkan untuk menggunakan penyelesaian JavaScript seperti:

• !window.Touch: Menyemak ketiadaan objek Touch pada peranti.
• Modernizr: Pustaka JavaScript yang merangkumi ujian 'touchevents'.

Dengan menggunakan salah satu kaedah ini, pembangun boleh menyasarkan bukan- peranti skrin sentuh dan tingkatkan pengalaman pengguna dengan sewajarnya.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mengesan Peranti Skrin Sentuh lwn. Bukan Skrin Sentuh dalam Pembangunan Web?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!