miniColor Picker in JQuery

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Colorpicker</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<input type="text" id="txtname" value="test" />
<input id="colorpicker" type="text" autocomplete="off" style="display:none" class="color-picker miniColors" name="color" />
</div>
</form>
<script src="Script/jquery-1.7.1.min.js"></script>
<script src="Script/colorpicker/jquery.miniColors.min.js"></script>
<link href="Script/colorpicker/jquery.miniColors.css" rel="stylesheet" />
<script>
$(document).ready(function() {
$("#colorpicker").miniColors({
change: function(hex, rgb) {
$("#txtname").css("color", $("#colorpicker").val());
}
});
$(".miniColors-trigger").click(function() {
colorPickerId = $("#colorpicker").val();
});
});
</script>
</body>
</html>