<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Bootstrap颜色拾取器插件</title>
<link href="http://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css/htmleaf-demo.css">
<link href="dist/css/bootstrap-colorpicker.css" rel="stylesheet">
<style type="text/css">
.colorpicker-component{margin-top: 10px;}
</style>
</head>
<body>
<div class="htmleaf-container">
<header class="htmleaf-header">
<h1>Bootstrap颜色拾取器插件 <span>Bootstrap Colorpicker is a simple and customizable colorpicker component for Twitter Bootstrap</span></h1>
<div class="htmleaf-links">
<a class="htmleaf-icon icon-htmleaf-home-outline" href="http://www.jb51.net/" title="脚本之家" target="_blank"><span> 脚本之家</span></a>
<a class="htmleaf-icon icon-htmleaf-arrow-forward-outline" href="http://www.jb51.net/" title="返回下载页" target="_blank"><span> 返回下载页</span></a>
</div>
</header>
<div class="container" style="padding:2.5em 0;">
<h3>最基本的颜色拾取器</h3>
<input id="mycp" type="text" class="form-control" />
<hr>
<h3>为颜色拾取器设置初始颜色</h3>
<div id="cp2" class="input-group colorpicker-component" title="Using input value">
<input type="text" class="form-control input-lg" value="#DD0F20"/>
<span class="input-group-addon"><i></i></span>
</div>
<div id="cp3a" class="input-group colorpicker-component" data-color="#F18A31"
title="Using data-color attribute in the colorpicker element">
<input type="text" class="form-control input-lg"/>
<span class="input-group-addon"><i></i></span>
</div>
<div id="cp3b" class="input-group colorpicker-component" title="Using data-color attribute in the input">
<input type="text" class="form-control input-lg" data-color="#F8EB48"/>
<span class="input-group-addon"><i></i></span>
</div>
<div id="cp4" class="input-group colorpicker-component" title="Using color option">
<input type="text" class="form-control input-lg"/>
<span class="input-group-addon"><i></i></span>
</div>
<hr>
<h3>设置颜色的格式</h3>
<div id="cp5" class="input-group colorpicker-component" title="Using format option">
<input type="text" class="form-control input-lg" value="#305AA2"/>
<span class="input-group-addon"><i></i></span>
</div>
<hr>
<h3>水平模式</h3>
<div id="cp6" class="input-group colorpicker-component" title="Using horizontal option">
<input type="text" class="form-control input-lg" value="#6D2781"/>
<span class="input-group-addon"><i></i></span>
</div>
<hr>
<h3>禁用alpha通道</h3>
<div id="cp9" class="input-group colorpicker-component">
<input type="text" class="form-control input-lg" value="rgba(248, 235, 72, 0.5)"/>
<span class="input-group-addon"><i></i></span>
</div>
<hr>
<h3>禁用十六进制颜色值前缀</h3>
<div id="cp10" class="input-group colorpicker-component">
<input type="text" class="form-control input-lg" value="#16813d"/>
<span class="input-group-addon"><i></i></span>
</div>
</div>
</div>
<script src="http://libs.baidu.com/jquery/2.1.1/jquery.min.js" type="text/javascript"></script>
<script>window.jQuery || document.write('<script src="js/jquery-1.11.0.min.js"><\/script>')</script>
<script src="dist/js/bootstrap-colorpicker.js"></script>
<script type="text/javascript">
$(function () {
$('#mycp').colorpicker();
});
$(function () {
$('#cp2, #cp3a, #cp3b').colorpicker();
$('#cp4').colorpicker({"color": "#16813D"});
$('#cp5').colorpicker({
format: "rgba"
});
$('#cp6').colorpicker({
horizontal: true
});
$('#cp9').colorpicker({
useAlpha: false
});
$('#cp10').colorpicker({
useHashPrefix: false
});
});
</script>
</body>
</html>
bootstrap-colorpicker.zip （22个子文件） 
bootstrap-colorpicker src js 
jquery-plugin.js 1015B Colorpicker.js 22KB Color.js 5KB defaults.js 6KB sass colorpicker.scss 13KB js jquery-1.11.0.min.js 94KB related 
2.jpg 32KB 1.jpg 28KB dist js bootstrap-colorpicker.js 83KB bootstrap-colorpicker.js.map 109KB bootstrap-colorpicker.min.js 34KB bootstrap-colorpicker.min.js.map 207KB css bootstrap-colorpicker.css 14KB bootstrap-colorpicker.min.css 13KB bootstrap-colorpicker.min.css.map 30KB bootstrap-colorpicker.css.map 16KB css htmleaf-demo.css 6KB
index.html 4KB fonts icomoon.woff 1KB
icomoon.svg 2KB icomoon.eot 2KB icomoon.ttf 1KB资源评论
