當用戶「點擊」時在移動Safari中添加：懸停效果

只要移動Safari用戶單擊某個div區域，是否可以觸發:hover事件？當用戶「點擊」時在移動Safari中添加：懸停效果

它不一定是一個鏈接。實際上，它不能成爲鏈接，因爲用戶會轉到另一個網頁。

我應用的懸停效果實際上是一個div：#div:hover {color:#ccc;} 我希望這個懸停發生在iPad或iPhone用戶單擊div區時。

~~我知道存在一個鏈接的背景顏色那塊CSS的： -webkit-tap-highlight-color:rgba(200,0,0,0.4); 但這並不適用於我的情況。~~

~~如果這可能適用於文本的顏色，例如，那麼我可以使用它。~~

更新：請參考下面

2011-08-21 davecave

這似乎是一個答案： http://stackoverflow.com/questions/2851663/how-do-i-simulate-a-hover-with-a-touch-in-touch-enabled-瀏覽器 – davecave

我已經想出瞭如何觸發：當用戶點擊div區而不使用javascript時，將鼠標懸停。這是使用display:none;和display:block;完成的。

例如：

<div class="block"> 
    <p>This content is shown *before* the user hovers over .block or taps .block on an iOS device.</p> 
    <div class="mask"> 
     <p>This content is shown *after* the user hovers over .block or taps .block on an iOS device.</p> 
    </div> 
</div>

CSS：

.block { 
    width:300px; 
    height:300px; 
    background:black; 
} 

.mask { 
    width:300px; 
    height:300px; 
    background-color:gray; 
    display:none; 
} 

.block:hover .mask { 
    display:block; 
}

我已發現：懸停僅觸發iOS上，同時使用display（相對於opacity）。此外，CSS轉換忽略display，所以這不能用CSS轉換。如果您想爲桌面用戶的過渡，可以添加opacity:0;和opacity:1;

編輯：CSS visibility也似乎工作。

謝謝你的時間。

來源

2012-07-13 01:08:48 davecave

我接受的答案你的背景下談論這個與UIWebview？您可以注入CSS或Javascript，並將其視爲任何其他瀏覽器。如果你這樣做，我會建議jQuery

如果你不使用UIWebView那麼我們需要在UIView上定義手勢識別器，並處理手勢。即在手勢處理程序作出懸停uiview並將其刪除，因爲用戶的水龍頭不見了...

來源

2011-08-21 03:48:43

我認爲他正在談論移動safari – kenwarner

哦對了，對不起，我正在談論的只是在移動Safari瀏覽器中使用CSS。我意識到那不清楚。 – davecave

然後我猜任何JavaScript框架+你自己的處理程序應該解決的東西... –

當用戶「點擊」時在移動Safari中添加：懸停效果

回答

相關問題