bigcolorpicker 颜色拾取器插件——例

参考：http://bigui4.sinaapp.com/picker/colorpicker.html

效果：

html:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
        <title>取色</title>
        <script type="text/javascript" src="js/jquery.js"></script>
        <link rel="stylesheet" href="http://bigui4.sinaapp.com/css/jquery.bigcolorpicker.css">
        <script src="http://bigui4.sinaapp.com/js/jquery.bigcolorpicker.js"></script>
        <style>
            input{
                background:none;
                outline:none;
                border:1px solid gray;
            }
        </style>
    </head>
    <body>
        <div>
            <input type="text" value="" id="demoText" />
            <input id="bn" type="button" value="选色" />
        </div>
        <script type="text/javascript">
            $("#bn").bigColorpicker(function(el, color) {
                $('#demoText').css('background', color);
                $('#demoText').val(color);
            });
        </script>
    </body>
</html>

注意：还需将big_bgcolor.jpg复制到项目中，图片放置的目录结构参考css：

.bigpicker-bgimage{
    background-image:url(../images/big_bgcolor.jpg);
}

big_bgcolor.jpg：