如何在颜色选择添加到我的绘图应用程序

在我的绘图程序，我只能说我已经把在特定的颜色，但我希望有一个颜色选择器像this one，我已经尝试只是添加的颜色负载，但它变得太多，并与我的工具栏重叠。如何在颜色选择添加到我的绘图应用程序

<div id="colors"> 
    <div class="swatch active" style="background-color: black"></div> 
    <div class="swatch" style="background-color: grey"></div> 
    <div class="swatch" style="background-color: red"></div> 
    <div class="swatch" style="background-color: green"></div> 
    <div class="swatch" style="background-color: blue"></div> 
    <div class="swatch" style="background-color: yellow"></div> 
    <div class="swatch" style="background-color: orange"></div> 
    <div class="swatch" style="background-color: indigo"></div> 
    <div class="swatch" style="background-color: violet"></div> 
    <div class="swatch" style="background-color: #FF0080"></div> 
</div>

这里是my jsfiddle。请涉及我的代码，所以它肯定会工作。

来源

2014-11-23 Daniel Adams

请仔细阅读以上说明，[如何接受答案工作]（http://meta.stackoverflow.com/questions/5234/how-does-accepting-an-answer-work） - 不要编辑的问题文本说，这是固定的。 – Quentin 2014-11-23 18:49:54

我只想用一个插件。

这一个看起来很有希望http://www.eyecon.ro/colorpicker/#about

您的代码也能像例如，一个页面

$('#colorSelector').ColorPicker({ 
    color: '#0000ff', 
    onShow: function (colpkr) { 
     $(colpkr).fadeIn(500); 
     return false; 
    }, 
    onHide: function (colpkr) { 
     $(colpkr).fadeOut(500); 
     return false; 
    }, 
    onChange: function (hsb, hex, rgb) { 
     $('#colorSelector div').css('backgroundColor', '#' + hex); 
    } 
});

这里是让插件工作http://www.eyecon.ro/colorpicker/#implement

来源

2014-11-23 04:49:32 John

不能得到它@约翰 – 2014-11-23 15:14:35

这个插件工作需要jQuery的你需要包括jQuery的文件中。请确保您包括您的HTML顶部的文件，这些文件是在正确的位置相对于彼此。 – John 2014-11-24 22:41:22

如何在颜色选择添加到我的绘图应用程序

回答

相关问题