CSS悬停没有对触摸屏设备忽略 [英] CSS hover not being ignored on touch-screen devices

问题描述

我追加一个div一个HTML按钮：

I've appended a div with a html button:

$('.nav').append('<button class="restart">Restart</button>');

按钮具有悬停CSS属性。我的问题是敲击触摸屏设备上的按钮时，该按钮保留其悬停状态，直到另外一个元素被挖掘出来。

The button has css properties for hover. My problem is that when tapping the button on a touch-screen device, the button retains its hover state until another element is tapped.

有没有悬停性能可与触摸屏设备浏览时，可以忽略什么办法？

Is there any way that the hover property can be ignored when browsing with a touch-screen device?

推荐答案

不是一个理想的解决方案，但由于@dualed的领先地位！

Not an ideal solution, but thanks @dualed for the headstart!

@media screen and (min-device-width:768px) and (max-device-width:1024px) /*catch touch screen devices */
{
    button.restart:hover
    {
        /* replicate 'up' state of element */
    }
}

这篇关于CSS悬停没有对触摸屏设备忽略的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！