Javascript 为ui滑条显示指标和里程碑标签

使用HTML和JavaScript

我创建了一个滑动条，它通过选择选项成功地双向响应。 但是，我选择了“隐藏”选择选项框。我想知道是否有人能给我一些关于为滑动条创建标签的提示，因为用户现在不知道他们在选择什么。我发现的示例显示了完美的指示器、里程碑数字和浮点数，当鼠标悬停在上面时，所有内容都与滑动条相关，而不是标签。救命啊

我的JavaScript滑块条形码

        $(function() {
            var select = $( "#logbytes");
            var slider = $( " <div id='slider'></div>").insertAfter(select).slider({
                min: 1,
                max: 6,
                step: 1,
                value: select[0].selectedIndex + 1, 
                slide: function(event, ui) {
                    select[0].selectedIndex = ui.value - 1;
                }
            });

            $('#logbytes').after(slider).hide();
        });

$（函数（）{
var select=$（“#logbytes”）；
变量滑块=$（“”）.insertAfter（选择）.slider({
民:1,，
最高：6，
步骤：1，
值：选择[0]。选择索引+1，
幻灯片：功能（事件、用户界面）{
选择[0]。selectedIndex=ui.value-1；
}
});
$（'#logbytes'）。在（滑块）.hide（）之后；
});

基本思想是将滑块包装在包装器div中，然后在包装器中添加另一个div。其文本将是滑块的当前值

然后唯一要做的就是移动这个div并更新它的文本。有点像：

slide: function(event, ui) {
    $( ".amount" ).text( ui.value );
    $( ".amount" ).css("margin-left",(ui.value-min)/(max-min)*100+"%");
}

其中，最小值和最大值是滑块的最小值和最大值

---

请参见示例。

您的确切意思是什么？类似于一个当前值在div上方的标签？是的，只是一些指示所选内容的东西，因为在最小值时，我只有滑块。或者类似于滑动条下面的时间线条，比如01 2 3 4