2012-02-09 54 views
10

我目前正在探索適用於iOS設備的網絡應用程序,並使用PhoneGap來創建「原生」應用程序。我遇到的問題是放大鏡,我不想在選擇段落(或文本位)時顯示。我已經嘗試了很多解決方案,但是下面的工作。我用這個CSS來禁用這些領域我wan't全部複製,選擇和這樣的:在iOS網絡應用程序中擺脫放大鏡

*[untouchable] { 
    -webkit-user-drag: none; 
    -webkit-user-modify: none; 
    -webkit-highlight: none; 

    -webkit-touch-callout: none; 
    -webkit-user-select: none; 
    -khtml-user-select:  none; 
    -moz-user-select:  none; 
    -ms-user-select:  none; 
    -o-user-select:   none; 
    user-select:   none; 
} 

這工作得很好,但它仍然顯示magnifer /放大鏡,當我請按住文本:

Touch + hold shows magnifier on text

有沒有真正的解決方案呢?這將是一個簡單的CSS屬性,如-webkit-magnifier: none或類似的東西真棒。如果有JavaScript解決方案,那也可以,但也許是一種矯枉過正。

由於我使用PhoneGap並且它使用UIWebView來顯示頁面,所以可能有一種禁用放大鏡的方法 - 但我沒有在本地源代碼中查找那麼多。

預先感謝:-)

+0

這個工作非常適合我。我使用了CSS選擇器*。謝謝。接受更多答案! – Prospero 2012-11-25 18:33:34

+0

hi fnky,我面臨同樣的問題,你是否找到了解決方法?謝謝 – 2014-08-27 21:45:31

回答

4

來完成此的唯一方法是,因爲放大鏡被結合以完全除掉選擇的元素。 -webkit-user-select:none;應適用於您不希望放大鏡出現的所有元素。

+0

你可以在'untouchable'元素中看到已經應用了'-webkit-user-select:none;'屬性 - 爲什麼它不會起作用嗎? – fnky 2012-02-13 19:21:17

+1

您還有-webkit-user-callout設置爲無,因此我不確定您的問題可能是什麼。請務必將這些屬性設置爲正確的元素,並檢查CSS是否有錯誤。 – 2012-02-17 19:11:48

+1

我確認你們都需要「-webkit-user-callout:none;」和「-webkit-user-select:none;」禁用放大鏡 – Max 2014-03-28 09:06:26

0

這是我用來

* { 
     -webkit-touch-callout: none; 
     -webkit-user-callout: none; 
     -webkit-user-select: none; 
     -webkit-user-drag: none; 
     -webkit-user-modify: none; 
     -webkit-highlight: none; 
}