方法はいろいろあると思います。
PCの時だけ、bodyタグのclassに、Javascriptで「pc」を入れます。
.pc a:hover {
background: rgba(240,240,240,1);
}
こんな感じで書くと、PCの時だけa:hoverが適用されるようになります。
classに、「pc」を入れるスクリプト
<script>
document.addEventListener('DOMContentLoaded', function(){
var mobile = /iPad|iPhone|iPod|Android/.test(navigator.userAgent);
if(mobile){
}else{
document.body.classList.add("pc");
}
});
</script>
表示するページのどこかに上記のスクリプトを入れてください。PCの時だけ、bodyタグのclassにpcと入るかと思います。Chromeとかのデベロッパーツール(F12)で確認すればよくわかるかと思います。
そのほかの方法
@media screen and (min-width: 980px) {
/*横幅が980px以上のとき= ほぼPC */
a:hover {
background: rgba(240,240,240,1);
}
}
ネットでよく見かける方法は、上記のようなものです。
ただし、表示幅で判断してるので、確実ではないんですね。たとえば、iPadとかは上記だと微妙では?!
スポンサーリンク
コメントを残す