1

ハンドルにカスタムスタイルを指定して、JQueryUIスライダーを拡張しています。

コードは次のとおりです。

JavaScript：

var slider = $("#container").slider();
var handle = $(".ui-slider-handle", slider);

それから私はやっています

handle.css("backgroundColor","yellow");

動作します。

しかし、次のようなクラスを作成すると、次のようになります。

.yellow
{
   background-color: yellow;
}

と使用

  handle.addClass("yellow"); // works!

それはそれを拾いません。1つ明確にしましょう。CSSの場所は有効であり、カスタムCSSのJQueryの元のスタイルを次のように上書きすると、カスタムCSSはJQueryCSSの後に適用されます。

.ui-slider-horizontal .ui-slider-handle 
{ 
   background-color: yellow;    
}

それは再び動作します。それはただaddClassであり、尊重されていないようです。addClassで動作させる方法について誰かアドバイスがありますか？

4

1 に答える 1

1

私はあなたがcssの特異性に問題があると思います。つまり、あなたのクラスの.yellow特異性はそれほどではありません。.ui-slider-horizontal .ui-slider-handle

1つの解決策は、黄色に特異性を追加して、次のようにオーバーライドされないようにすることです。

.ui-slider-horizontal .ui-slider-handle.yellow {
background-color: yellow;
}
于 2012-08-10T15:14:54.573 に答える