在禁用模式下,如何更改seiyria bootstrap-slider的工具提示背景颜色?

阿努布

当它处于禁用模式时,我在更改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,我禁用了滑块,但是当它处于禁用模式时,我需要更改与滑块手柄相同的工具提示颜色。如下图所示。

slider-disabled就像在我创建的这个DEMO FIDDLE中那样,通过CSS访问CSS类即可

.slider-disabled .tooltip-inner {
    background-color: red;
}

.slider-disabled .tooltip.top .tooltip-arrow {
  border-top-color: red;
}

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

更改Bootstrap工具提示颜色

更改 Bootstrap 工具提示的颜色

Bootstrap 4更改工具提示箭头颜色

bootstrap3-在合拢模式下如何更改背景颜色

在 updatePanel 中时 Bootstrap 工具提示颜色已更改

Bootstrap工具提示箭头边框和背景颜色

使用图表颜色动态更改工具提示的背景颜色

如何在Unity中更改工具提示背景颜色?

如何更改Bootstrap工具提示文本?

如何更改Bootstrap已禁用按钮的颜色?

Bootstrap工具提示禁用按钮Firefox / Chrome

Bootstrap向导无法摆脱禁用的工具提示

如何更改 Bootstrap 导航栏的背景颜色

如何更改 bootstrap-sweetalert 的背景颜色?

如何更改Bootstrap弹出框的背景颜色

如何更改Bootstrap轮播插件的背景颜色?

是否可以在不使用 javascript 的情况下更改工具提示消息的背景和文本颜色?

使用 CSS 更改 Bootstrap 工具提示样式

单击更改Twitter Bootstrap工具提示内容

更改bootstrap 3箭头工具提示的宽度

如何在禁用按钮上启用Bootstrap工具提示?

如何在Bootstrap-Slider中将工具提示设置为文本字符串与刻度值

如何在一页网站中更改导航和悬停工具提示背景颜色

如何更改泳道/ngx-charts 中工具提示的背景颜色

如何设置Bootstrap 4工具提示的样式

如何使React Bootstrap工具提示适合容器?

Bootstrap工具提示-如何访问“此”

如何使Twitter Bootstrap工具提示可访问?

如何使Angular Bootstrap工具提示起作用?