我试图在 jquery ui 范围 slider 句柄中设置一个值的样式。
我正在使用这个 DEMO
另外,我已经使用了这个 CSS,但它仍然无法正常工作。我哪里错了?
<div class="demo">
<div id="slider-vertical" class="sliderControl-label v-labeCurrent"></div>
</div>
.sliderControl-label {
color: #CCCCCC;
font-size: 16px;
font-weight: bold;
position: absolute;
top: -10px;
}
.ui-slider-handle .sliderControl-label .v-labelCurrent {
color: #777777;
font-size: 16px;
line-height: 24px;
position: relative;
text-shadow: 0 1px 0 #FFFFFF;
top: -2px;
transition: color 0.15s linear 0s;
}
$(function(){
$("#slider-vertical").slider({
orientation: "vertical",
range: "min",
min: 0,
max: 100,
value: 60,
slide: function( event, ui ) {
$( "#amount" ).val( ui.value );
$(this).find('.ui-slider-handle').text(ui.value);
},
create: function(event, ui) {
var v=$(this).slider('value');
$(this).find('.ui-slider-handle .sliderControl-label .v-labelCurrent').text(v);
}
});
});
我让自己陷入了正确的 CSS 困惑之中。
最佳答案
使用 .ui-slider .ui-slider-handle
作为您的 CSS 选择器(并在 jQuery UI CSS 文件下声明这些样式)。
.ui-slider .ui-slider-handle {
width:2em;
left:-.6em;
text-decoration:none;
text-align:center;
}
关于css - jquery ui slider 样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13033710/