Javascript 如何在手机/平板电脑浏览器(触摸屏)中启用css光标:指针(手符号)

Javascript 如何在手机/平板电脑浏览器(触摸屏)中启用css光标:指针(手符号),javascript,html,jquery,css,accessibility,Javascript,Html,Jquery,Css,Accessibility,上面的CSS样式在桌面浏览器中工作得非常好。我想知道,当我们触摸手机/平板电脑浏览器中的相关控件时,是否有任何方法可以显示手符号 我不确定是否只在CSS中使用,但在JS/jQuery中,可以通过创建一个元素来实现: .HandSign{ cursor: pointer; } 然后使用JS/jQuery在每次单击时移动/显示元素。桌面和移动设备都会触发Click: #customPointer{ position: absolute; left: 0px;

上面的CSS样式在桌面浏览器中工作得非常好。我想知道,当我们触摸手机/平板电脑浏览器中的相关控件时,是否有任何方法可以显示手符号

我不确定是否只在CSS中使用,但在JS/jQuery中,可以通过创建一个元素来实现:

.HandSign{    
    cursor: pointer;
 }
然后使用JS/jQuery在每次单击时移动/显示元素。桌面和移动设备都会触发Click:

#customPointer{
    position: absolute;
    left: 0px;
    top: 0px;
    display: hidden;
}
关于这一点,请注意:

  • 触摸屏桌面可能会表现得很奇怪
  • if(e.touchs)将确定它实际上是来自鼠标还是触摸屏,以防止它对真实的鼠标事件执行任何操作
  • 您可能还希望为onmousemove添加一些内容,以便在移动鼠标时将显示改回隐藏

  • 触摸背后的想法不是没有鼠标指针吗?我想你需要创建一些自定义指针,如果你需要触摸设备的指针,它会被你的手指隐藏。这项要求的目的是什么?如果你想让触摸更明显,那么有更好的方法突出显示触摸的元素。问题太不清楚了。
    #customPointer{
        position: absolute;
        left: 0px;
        top: 0px;
        display: hidden;
    }
    
    $('body').onClick(function(event){
            setPointer(event);
        });
    
    function setPointer(e){
        if(e.touches){
            $('#customPointer').css({'top': e.pageY, 'left': e.pageX, 'display': 'inline-block'});
        }
    }