iOS8.4.1以降でhoverにopacityを設定するとリンクがダブルタップしないと動いてくれない問題にでくわした話

こんにちは！　最近フロントよりもやってる@srockstyleです！

iOSの8.4.1になってa:hoverがなんかイラッとする挙動するようになったなあ？という方いませんか？　僕です！

iOS8.4.1でダブルタップしないとリンクを飛んでくれない問題

ChromeでもSafariでも出現しました！

こんな感じのタグにすると発生するようです。

<a href="/link.html">

a {
	&:hover {
		opacity: 0.8 ;
	}
}

対策

iOSに限るので、Media Queryで対応できます。
hover -> activeとかにすると対応も可能です。jQueryでもいいですし、究極opacityの値を1にすればいいです。

僕はCSSの対応だけでできました！（なおこの結論に至るまで6時間かかった模様）

a {
	&:active {
		opacity: 1 ;
	}
}

@media screen and (min-width:  960px) {
	a {
		&:hover {
			opacity: 0.8 ;
		}
	}
}

これでPC版はopacity効くけどそれ以外はなしという対応ができます。

同じ問題で困っている方の参考になれば！