0

我不确定这叫什么，所以我无法搜索它，但如果你转到http://vps.net/product/cloud-servers/并向下滚动到 VPS 节点，它是如何创建的？有什么教程或任何我可以看的吗？这是一个什么样的滑块？

谢谢！

4

3 回答 3

3

他们正在使用一个 jQuery-UI 滑块，带有一个自定义的回调，突出显示小节点框：

$('#slider').slider({
    range: "max",
    min: 1,
    max: 15,
    step: 1,
    slide: function(event, ui) {
        // Un-highlight nodes
        $('.node').removeClass('highlight');
        // Highlight all nodes up to value selected
        $('.node:lt('+ui.value+')').addClass("highlight");
    }
});

这是我的示例代码，我不想解析他们的混淆代码来查看他们实际为回调做了什么。这可能与此非常相似。

演示：http: //jsfiddle.net/jtbowden/A8ccw/1/

如果将step值更改为小数值，例如.01，则可以摆脱步进行为，然后使用Math.floor()来确定突出显示索引。

演示：http: //jsfiddle.net/jtbowden/A8ccw/4/

这是一个更新多个数据字段的演示：

演示：http: //jsfiddle.net/jtbowden/A8ccw/8/

于 2012-04-11T22:25:24.863 回答
2

您可以使用 jquery ui 滑块执行此操作：http: //jqueryui.com/demos/slider/

于 2012-04-11T22:15:54.750 回答
0

也看看http://egorkhmelev.github.com/jslider/

于 2012-04-11T22:44:33.557 回答