Javascript обнаруживает, есть ли у пользователя мышь

Question

Это не для дизайна, я делаю учебник, где я бы попросил пользователя нажать или нажать на вещи.

Сейчас я использую:

("ontouchstart" in document.documentElement);

Но это не работает на ноутбуках с сенсорным экраном.

Answer 1

Для этого вы можете использовать медиазапросы CSS .Чтобы обнаружить мышь, ваш запрос будет выглядеть следующим образом:

@media (hover: hover) and (pointer: fine) {
    // 'hover' means a device that supports hovering
    // 'pointer: fine' means an accurate pointing device, as opposed to limited pointing device like touchscreen (where you would use 'coarse' value
}

Обратите внимание, что этот запрос также обнаружит сенсорную панель, но не обнаружит смартфоны, сенсорные экраны, экраны на основе стилуса или другие контроллеры, такие как Nintendo Wii., Microsoft Kinect.

Чтобы выполнить тот же запрос из JavaScript , вы можете использовать Window.matchMedia():

if (matchMedia('(hover: hover) and (pointer: fine)').matches) {
  // You code
}