web-dev-qa-db-ja.com

jQueryを使用するときにSafariで強調表示されているデフォルトのボタンを削除する方法

OS XのSafariでは、デフォルトのjQueryボタンの周りに青いグローが強調表示されていることに気付きました。チェックしたところ、同じことが jQuery UIデモページ で発生しました。

Default button highlighting under Safari

私の同じマシンのFirefoxでは、次のようになります

enter image description here

Safariでこれを削除するために何ができるかを教えてもらえますか?私はまだデフォルトの振る舞いが欲しいです。

50
Dutts

ブラウザがデフォルトのアクションとして適用する可能性のある入力のハイライトを削除するには、常にoutline:none彼らのcss。あなたの場合、それはbutton要素です。これはうまくいくはずです:

button {
    outline: none;
}

ただし、CSSアウトラインを削除することはお勧めしません。 アクセシビリティに悪いため。 (これについて言及してくれたRobin Clowersに感謝します)

101
Arash Milani

これを使ってみてください

CSSで:

_-webkit-tap-highlight-color: rgba(0,0,0,0);
_

Javascriptの場合:

document.addEventListener("touchstart", function(){}, true);

6
Harsheet
*{
    outline: none;
}

.blah{
    outline-color: blue;
}

これは既存のものには影響しません。 (.blah)これはGoogleで動作しますChromeもです。

ライブデモ:http://jsfiddle.net/DerekL/TUbjc/

4

このボタンには、実際にアウトラインプロパティが定義されています。これをオーバーライドする必要があります。 Firebugでこれを調べると、このボタンに対して次のCSS宣言が表示されます。

.ui-dialog .ui-dialog-buttonpane button{outline:none;}
0
defau1t