55

私の iPhone Web サイトには、テキストが含まれていない要素がいくつかありますが、ユーザーはそれらをクリックして保持する必要があります (DIV)。これにより、テキストの強調表示/編集ループ/カーソルが表示され、気が散ってしまいます。

クリック可能な要素に触れたときに表示されるブラックボックスを削除するための CSS ルールがあることは知っています。テキスト拡大鏡を無効にするようなものはありますか?

4

7 に答える 7

50

DeveloperCenterヘルプデスクから回答がありました。このCSSルールを追加する必要がありました：

-webkit-user-select: none;
于 2009-05-29T00:00:20.287 に答える
5

これは、画像など、コピーまたは保存したくないコンテンツを保護する場合にも役立ちます。

#yourdiv img {-webkit-touch-callout: none; }
于 2009-12-08T06:40:24.307 に答える
5

これはJSで私のためにそれを解決しました：

document.getElementsByTagName("body")[0].addEventListener("touchstart",
 function(e) { e.returnValue = false });

OSがタッチをキャッチするためにそこにあるものは何でもバイパスするようです。

于 2016-03-07T23:51:54.400 に答える
4

これは自分で試しているうちにわかりました。まず、このルールを外側の要素に追加する必要があります。

-webkit-user-select: none;

しかし、それだけでは iPhone では十分ではありません。たとえば、親要素が選択を受け入れるため、または単にそのように感じるため、虫めがねが表示される可能性があることがわかりました。

しかし、その後、私は何かクールなことを発見しました - あなたの要素がtouchendandclickハンドラーを要素に追加すると、Apple の Safari は最終的に、虫眼鏡を表示させる厄介なコード パスを回避し、おそらくこの要素が何らかの UI 相互作用のためのものであり、そうではないことに気付きます。テキストの選択。同様に素晴らしいことに、画面の上部近くの要素でこれを行うと、横向きモードでのナビゲーションの表示もキャンセルされます! ただし、下部の要素をクリックしたときにナビゲーションの外観をキャンセルする方法がわからない場合、その解決策はありますか?

于 2014-09-10T17:40:28.250 に答える