一些基本用法 http://jscolor.com/try.php

hmildd

<script type="text/javascript" src="jscolor/jscolor.js"></script>

Click here: <input class="color" value="66ff00">
<p> This field can be left empty: <input class="color {required:false}">
<p> This field accepts any value: <input class="color {adjust:false}">
<p> Hash symbol:                  <input class="color {hash:true}">
<p> Hash symbol, lowercase:       <input class="color {hash:true,caps:false}">

HSV mode: <input class="color {pickerMode:'HSV'}">
HVS mode: <input class="color {pickerMode:'HVS'}">
<p style="margin-left:210px">Left:  <input class="color {pickerPosition:'left'}">
<p style="margin-left:90px"> Right: <input class="color {pickerPosition:'right'}">
<p style="margin-top:65px">  Top:   <input class="color {pickerPosition:'top'}">

<p> Stronger borders: <input class="color {pickerBorder:3,pickerInset:10}">
<p> Stronger face:    <input class="color {pickerFace:20}">

<p> Colour outer border:  <input class="color {pickerBorderColor:'red green blue yellow'}">
<p> Colour inset borders: <input class="color {pickerInsetColor:'#9F9 #090 #090 #9F9'}">
<p> Colour picker face:   <input class="color {pickerFaceColor:'#01BABE'}">
<p> Transparent picker:   <input class="color {pickerFaceColor:'transparent',pickerFace:3,pickerBorder:0,pickerInsetColor:'black'}">
<input class="color {pickerOnfocus:false}" id="myColor"> this field has disabled automatic showing/hiding of a picker

<p> Move the mouse over these buttons:

<input type="button" value="Show"
   >
<input type="button" value="Hide"
   >

<p> Change background: <input class="color"
   >
<script type="text/javascript">
function updateInfo(color) {
    document.getElementById('info-r').value = color.rgb[0];
    document.getElementById('info-g').value = color.rgb[1];
    document.getElementById('info-b').value = color.rgb[2];
}
</script>

Color: <input class="color {onImmediateChange:'updateInfo(this);'}" value="66ff00">
R: <input id="info-r" size="2" />,
G: <input id="info-g" size="2" />,
B: <input id="info-b" size="2" />


R<input id="red" size="5">  G<input id="grn" size="5">  B<input id="blu" size="5">  - - -
H<input id="hue" size="5">  S<input id="sat" size="5">  V<input id="val" size="5">

<p> Choose any color: <input class="color" id="myColor">



<input class="color" id="myColor">

<input type="submit" value="Move mouse"
   >
<input type="submit" value="Move mouse"
   >
<input type="submit" value="Move mouse"
   >



<p> Redirect value: <input class="color {valueElement:'myValue'}"> <input id="myValue">

<p> Redirect style: <input class="color {styleElement:'myStyle'}"> <input id="myStyle">

<p> Redirect both:  <input class="color {valueElement:'myBoth',styleElement:'myBoth'}"> <input id="myBoth">



<input id="myField1">

<script type="text/javascript">
var myPicker = new jscolor.color(document.getElementById('myField1'), {})
myPicker.fromString('99FF33')  // now you can access API via 'myPicker' variable
</script>


<p> No Slider: <input class="color {slider:false}">




Click here: <input class="color {pickerClosable:true}">


Light colors only: <input class="color {minV:0.8}" value="66ff00">

Dark colors only: <input class="color {maxV:0.2}" value="66ff00">

Pale colors only: <input class="color {maxS:0.2}" value="66ff00">

Strong colors only: <input class="color {minS:0.8}" value="66ff00">