3

質問を簡潔にできることを願っています。

いくつかの css が定義されているとしましょう。

.someCSS-name:hover > .list-item,
.someCSS-name:active > .list-item,
.someCSS-name:focus > .list-item { display:block; }

さて、私のjqueryコードで、上記のcssでタブプレスを作成またはバインドする方法を教えてください。タブのキープレスがそのcssの動作を継承するようにしましたか?

多分私はここでそれを考えすぎています。

<li class="someCSS-name" id="linkoneli">
    <a href="someURL" id="linkonenav">Link One</a>
    <div class="list-item">show this content</div>
</li>

それはスニペットであり、基本的にそのリンクのユーザータブです-そして、ポップアップが表示されます..しかし、明示的にeventHandlingしてポップするのではなく..CSSを使用して、どうにかしてタブにバインドできることを望んでいました/キープレス..可能ですか?したがって、タブは「ホバー」などと同じです。

4

2 に答える 2

2

実際、アンカー要素のフォーカス状態で css セレクターを使用すると、その効果が得られます。必要なスニペットを次に示します。

#linkonenav:focus ~ .list-item {
  display: block;
}

http://jsfiddle.net/greenrobo/eLCmM/を試すだけのjsFiddle

于 2013-01-24T22:30:39.680 に答える
1

最も簡単な方法は、キープレスで .someCSS を切り替えるだけです。

$('.myElements').toggleClass('someCSS');

それがホバリングcssのオン/オフを切り替える場合。ホバーがオンとオフを切り替えるスタイルを切り替えたいだけの場合は、それらのスタイルを .active クラスに移動し、代わりにそのクラスを切り替えます。

$('.someCSS').toggleClass('.active');
于 2013-01-24T21:15:58.817 に答える