圆形滑块文本框始终可见
Round slider textbox always visable
我正在使用 http://roundsliderui.com/demos.html 圆形滑块库。我想显示可编辑的文本框总是显示而不是隐藏。谢谢
明白了,你应该提供代码,可以得到这里的人的帮助或建议。我把你提供的例子做了一些修改。
这是一个工作示例:http://jsfiddle.net/Twisty/Lorej7up/
HTML
<div class="slider-wrapper">
<div id="slider">
</div>
<input type="text" id="myToolTip" class="rs-input rs-tooltip-text" style="height: 27px; width: 32px;" />
</div>
CSS
.slider-wrapper {
position: relative;
}
.slider-wrapper input.rs-input {
position: absolute;
top: 95px;
left: 93px;
z-index: 100;
}
jQuery
function updateToolTip() {
$("#myToolTip").val($("#slider").roundSlider("option", "value"));
}
$(function() {
$("#slider").roundSlider({
sliderType: "min-range",
radius: 110,
width: 10,
startAngle: 90,
value: "82",
showTooltip: false,
editableTooltip: false,
drag: updateToolTip,
change: updateToolTip
});
$("#myToolTip").val($("#slider").roundSlider("option", "value"));
$("#myToolTip").change(function() {
$("#slider").roundSlider("option", "value", $(this).val());
});
});
我正在使用 http://roundsliderui.com/demos.html 圆形滑块库。我想显示可编辑的文本框总是显示而不是隐藏。谢谢
明白了,你应该提供代码,可以得到这里的人的帮助或建议。我把你提供的例子做了一些修改。
这是一个工作示例:http://jsfiddle.net/Twisty/Lorej7up/
HTML
<div class="slider-wrapper">
<div id="slider">
</div>
<input type="text" id="myToolTip" class="rs-input rs-tooltip-text" style="height: 27px; width: 32px;" />
</div>
CSS
.slider-wrapper {
position: relative;
}
.slider-wrapper input.rs-input {
position: absolute;
top: 95px;
left: 93px;
z-index: 100;
}
jQuery
function updateToolTip() {
$("#myToolTip").val($("#slider").roundSlider("option", "value"));
}
$(function() {
$("#slider").roundSlider({
sliderType: "min-range",
radius: 110,
width: 10,
startAngle: 90,
value: "82",
showTooltip: false,
editableTooltip: false,
drag: updateToolTip,
change: updateToolTip
});
$("#myToolTip").val($("#slider").roundSlider("option", "value"));
$("#myToolTip").change(function() {
$("#slider").roundSlider("option", "value", $(this).val());
});
});