jquery 旋钮光标宽度百分比答案

【问题标题】：jquery knob cursor width in percentagejquery 旋钮光标宽度百分比
【发布时间】：2013-07-04 11:52:06
【问题描述】：

我正在使用jquery knob，在我的用例中，我希望光标宽度以百分比表示，以便当宽度为 100% 时光标占据整个圆圈，但是它只接受数值作为输入，我的选择是什么？

   $(function() {
        $(".dial1").knob({
            'bgColor': 'green',
            "skin":"tron",
            'fgColor': 'red',
            'cursor': '100'
        });
    });

如果我给它一个值 320，光标会填满整个圆圈。

【问题讨论】：

标签： jquery jquery-knob

【解决方案1】：

我正在使用一种解决方法，如果我想要显示 x 百分比并且总计为 y，那么我正在执行 (x/y)*320 它以百分比形式给出光标宽度，因为 x 是动态的，光标会继续填充圆圈随着这个值的增加。由于这是一个非常具体的问题，我预计不会很快有其他答案，因此将其标记为答案。

【讨论】：

【解决方案2】：

据我所知，您唯一的选择是更改 jQuery 插件的源代码。以像素为单位的宽度在插件中是硬编码的，例如在第 153 行它说：

    this.$c = $('<canvas width="' +
                        this.o.width + 'px" height="' +
                        this.o.height + 'px"></canvas>');

this.o.width 值是您设置为 'cursor': '100' 的值。

您可以通过将px 更改为% 或删除px 并添加您希望它与第153 行示例类似的任何值来更改插件：

    this.$c = $('<canvas width="' +
                        this.o.width + " height="' +
                        this.o.height + "></canvas>');

然后在 init 中执行类似的操作：

$(function() {
    $(".dial1").knob({
        'bgColor': 'green',
        "skin":"tron",
        'fgColor': 'red',
        'cursor': '100%'
    });
});

【讨论】：

我已经进行了更改，但似乎不需要 %
我认为您正在更改画布尺寸，我需要的是光标