我在改变seiyria bootstrap-slider的tootltip颜色时遇到问题,当它处于禁用模式时。
HTML:
<slider ng-model="myCtrl.sliderValue" ng-min="0"
ng-disabled="myCtrl.ischlddsble"
ng-max="5"
step="1"
value="myCtrl.sliderValue"
ticks="myCtrl.sliderTicks()"
formatter="myCtrl.myFormatter"
tooltip="always"
id="divID"></slider>
<input type="checkbox"
ng-model="myCtrl.ischlddsble"
ng-click="myFunc()"/>
JavaScript的:
function myFunc(x, _this) {
if (_this.checked) {
x.style.backgroundColor = '#0000FF';
} else {
x.style.backgroundColor = '#FF0000';
}
}
通过使用ng-disabled,我禁用了滑块,但是当它处于禁用模式时,我需要更改与滑块手柄相同的工具提示颜色。如下图所示。
答案 0 :(得分:1)
只需通过CSS访问CSS类slider-disabled
,就像我创建的 DEMO FIDDLE 一样。
.slider-disabled .tooltip-inner {
background-color: red;
}
.slider-disabled .tooltip.top .tooltip-arrow {
border-top-color: red;
}