ユーザーが要素にカーソルを合わせると、CSSの「ホバー状態」がトリガーされます。
<style>
.element{
}
.element:hover{
background-color:red;
}
</style>
Javascriptを使用して要素を「ホバー状態」に設定するにはどうすればよいですか?
出来ますか?
:focus
ホバーの代わりに、次を使用できます。
var links = document.getElementsByTagName('a');
links[0].focus();
または
var linkToFocus = document.getElementById('link');
linkToFocus.focus();
このアプローチでは、明らかに、a:focus
スタイル:
a:link, a:visited {
background-color: #fff;
}
a:hover, a:focus, a:active {
background-color: #f00;
}
:hoverスタイルを別のクラスに複製し、永続的に変更したいときにそのクラス名を要素に追加する方がおそらく良いでしょう。擬似クラスは、理由により「擬似」です。