0

これは特に、jQueryUI テーマを使用する selectBoxIt jQuery プラグインで行われます。

ホバーアクション用にこれを設定しました：

/* Individual Option Hover Action */
.selectboxit-option .selectboxit-option-anchor:hover {
  color: #ffffff;
  background-color: #ff0000;
  text-decoration: none;
}

それはうまくいきます。オプションの上にマウスを置くと、赤い背景に白いテキストが表示されます。

しかし、これを行うと...

.selectboxit-option:focus .selectboxit-option-anchor:focus  {
  color: #ffffff;
  background-color: #ff0000;
  text-decoration: none;
}

...何も変わりません。

selectBoxIt のメイン Web ページにあるすべてのデモでは、キーボード フォーカスによって背景色が変化しているように見えます。何が欠けているのでしょうか?

4

1 に答える 1

0

技術的には、各オプションはフォーカス イベントを使用しないため、フォーカス疑似セレクターが機能しません。jQueryUI テーマの場合、「active」オプションは ui-state-focus クラスを追加するため、「focus」CSS スタイルを変更するには、次のようなルールを作成できます。

.selectboxit-option.ui-state-focus {
  background: #CCC;
}
于 2013-04-19T23:17:46.807 に答える