jQuery UI顏色選擇器問題

Question

我想創建一個顏色選擇器，但是它需要像這樣http://jqueryui.com/demos/slider/是水平的。它必須是可以滾動所有顏色的水平滑塊。 我試圖將其基於jquery ui滑塊。

有人從網上知道任何這樣的例子嗎？ 還是可以告訴我該怎么做？

我當時想根據滑塊設置的距離說50％，我需要將該值轉換為顏色值。

諸如0％距離是白色，而100％是黑色。

注意：它必須是1個可以在all顏色范圍內變化的滑塊，並且顏色必須平滑過渡，而不是全部隨機。

喜歡這張圖片： 但它需要以某種方式將白色和黑色結合到其中。

Answer 1

您可以將HTML顏色表示為十六進制值。 考慮到這一點，我們可以創建一個從#000000到#FFFFFF （或從0到16777215，以十進制表示）的滑塊：

$("#slider").slider({
    min: 0,
    max: 16777215,
    slide: function (event, ui) {
        var hex = "#" + ui.value.toString(16);
        $("#color").css("background-color", hex);
    }
});

請注意，要使其在遠程可用，您將需要一個相當長的滑塊。 為了更好地了解其工作原理，請使用鍵盤箭頭而不是鼠標在顏色之間滑動。

示例： http ： //jsfiddle.net/4extL/46/

Answer 2

有很多的jQuery UI的例子在這里的拾色器。 他們甚至提供了示例，您可以在其中滾動瀏覽所有顏色。 希望這可以幫助。

Answer 3

我認為這是不可能的。 我建議使用許多jQuery colorpicker插件之一。 或者您可以看一下這個jQuery UI示例-並非您想要的那樣，但是它確實使用了jQueryUI滑塊： http : //jqueryui.com/demos/slider/#colorpicker