JSFiddle - React, Tailwind, and code Playground

HTML

<header>my header</header>

JavaScript

var touchscreen;
if(window.matchMedia("(max-width: 300px)").matches){
  touchscreen = true;
}
else{
  touchscreen = false;
}

var evt = touchscreen ? 'touchstart' : 'mouseenter';

$("header").bind( evt, function(){
    if(touchscreen){
        alert('this is mobile touch event');
    } else {
        alert('this is desktop hover');
    }
});