[解決済み] モバイルSafariで:active擬似クラスが機能しない

2022-05-16 20:47:34

質問

iPhone/iPad/iPod の Webkit では、:active 疑似クラスに対するスタイリングの指定が <a> タグの :active 擬似クラスにスタイルを指定しても、その要素をタップしてもトリガーされません。どうすればトリガーされるようになりますか？コード例です。

<style> 
a:active { 
    background-color: red;
}
</style>
<!-- snip -->
<a href="#">Click me</a>

<body ontouchstart="">
    ...
</body>

すべてのボタン要素に対して一度だけ適用すると、ページ上のすべてのボタンが修正されるようです。あるいは、この小さな JS ライブラリである ' Fastclick '. これはタッチデバイスでのクリックイベントを高速化し、この問題も解決してくれます。