的CSS：懸停沒有「點擊」事件觸摸設備的

<div className="big-square"> 
    <div className="small-button">button</div> 
</div>

我需要顯示在.big-square:hover按鈕。這很簡單，但觸摸設備呢？如果我只使用.big-square:hover css規則，那麼如果用戶不小心點擊了按鈕的位置，那麼按鈕將會出現並立即點擊。我想避免這種情況。我試圖使用misc轉換延遲，但這不起作用。

這裏一個例子，以使其更易於理解和回答：
https://jsfiddle.net/hznjb8ur/

jQuery是有爲了簡單起見。我想避免在這種情況下使用jquery甚至js，因爲我在單個頁面上有幾十個和幾百個元素，所以我更願意用簡單的css技巧來解決這個問題。

2016-07-14 stkvtflw

見：http://stackoverflow.com/questions/21261961/hover-event-on-touch-device?rq= 1 – Cruiser

我曾嘗試過：懸停和它也與觸摸設備上的單擊事件一起工作 –

您可以使用媒體查詢 – user3091574

-1

:hover不支持觸摸設備。 :hover功能只有在觸摸屏上點擊時纔會被激活。

爲什麼不在觸摸設備上顯示按鈕而不是隱藏它？否則只有jquery可以幫助你。

2016-07-14 14:27:00 Red

「只有jquery可以幫助你」......上帝拯救了我們所有人。 –

我不知道是誰downvoted，但它沒有比我寫的真相：/ – Red

嗯，這是一個答案。 awnser是觸摸設備不支持：懸停事件（尚未）和JavaScript可以幫助做出解決方法 – Red

實際的「可觸摸」設備不支持懸停，因爲屏幕不知道指針（手指或其他）位置。

2016-07-14 14:30:31 Wilmer

回答