如何更改 Farbtastic 拾色轮的宽度和高度？答案

【问题标题】：How can I change the width and height of Farbtastic Color Picker Wheel?如何更改 Farbtastic 拾色轮的宽度和高度？
【发布时间】：2015-08-13 10:14:56
【问题描述】：

Farbastic Github Documentation上提到Farbtastic Color Picker的Width和Height可以这样修改；

$(...).farbtastic({ callback: '#color2', width: 150 })

但是，我无法自定义 Farbtastic 拾色器的宽度和高度。这是我的代码；

colorPickerWheel = $.farbtastic("#colorPickerWheel", { width: 500, height: 500 });
colorPickerWheel.linkTo(pickerUpdate);

function pickerUpdate(color){
    console.log("Color Picker Wheel: " + color);
}

等待回复，谢谢！

【问题讨论】：

你用过witch版本的jquery吗？
jquery-2.1.1.min.js jquery-ui-1.11.2/jquery-ui.js jquery.ui.touch-punch.min.js 这三个都包含在我的 HTML 页面中。

标签： javascript css colors color-picker farbtastic

【解决方案1】：

如果省略callback 参数，显然width 和height 不会被拾取（这可能是一个错误）。但是，您可以在初始化时通过在选项对象中传递callback: pickerUpdate 来解决它。

var colorPickerWheel = $.farbtastic("#colorPickerWheel", {callback: pickerUpdate, width: 500, height: 500});

colorPickerWheel.setColor('#00ffff');

function pickerUpdate(color){
    console.log("Color Picker Wheel: " + color);
}

https://jsfiddle.net/s2zhgsbr/1/

【讨论】：

我正在使用这行代码来获取变量colorPickerWheel colorPickerWheel = $.farbtastic("#colorPickerWheel"); 然后通过这行代码设置Hex值colorPickerWheel.setColor("#"+hex); 但是如果我使用你的方式，那么我该如何设置以后动态的颜色。请指导。谢谢你！
编辑了我的答案以使用其他初始化方法，允许您使用setColor()
使用这种语法，我的颜色选择器没有在我的页面上被调用，但是当我的代码恢复到上面问题中提到的colorPickerWheel.linkTo(pickerUpdate); 时，它会被调用。无论哪种方式，大小都不会改变:(请解释一下，再次感谢！

【解决方案2】：

它已经过测试并为我工作

$.farbtastic("#colorPickerWheel", { callback: pickerUpdate,width: 500,  height: 500 });

【讨论】：

使用这种语法，我的颜色选择器没有在我的页面上被调用，但是当我的代码恢复到上面问题中提到的colorPickerWheel.linkTo(pickerUpdate); 时，它会被调用。无论哪种方式，大小都不会改变:(请解释一下，谢谢！