[JS] Color Picker Script

by Mesak

Color Picker Script
網站:http://www.flooble.com/scripts/colorpicker.php

用途:在有些時候網頁需要選取顏色的時候需要用到的script

下午做了 FMP的修改,看到jw的作者的播放器設定程式中看到選顏色的功能,由於Script 並不大,所以打算整合到下個fmp的版本上

colorpicker

jw 修改的Color Picker Script 如下:
http://www.jeroenwijering.com/embed/colorpicker.js

作者主要是省略了 document.getElementById 這個 標準擷取id的 script 改為, gid 函式進行處理

使用方法如下

<a class="pick" id="欄位ID+pick" href="javascript:pickColor('欄位ID');"></a>

例如我有一個欄位叫做 backcolor ,寫法如下:

<input id="backcolor" type="text" />
<a class="pick" id="backcolorpick" href="javascript:pickColor('backcolor');"></a>

另外定義一下css

.pick {
border-left: 1px solid #444;
border-top: 1px solid #444;
border-right: 1px solid #BBB;
border-bottom: 1px solid #BBB;
margin:0 8px;
padding: 0 6px;
}
#colorpicker {
border-collapse: collapse;
position: absolute;
left: 300px;
top: 600px;
background-color: #FFF;
border-top: 1px solid #EEE;
border-left: 1px solid #EEE;
border-right:1px solid #999;
border-bottom:1px solid #999;
display: none;
padding:5px;
}
#colorpicker a {
display: block;
width: 15px;
height: 15px;
margin-bottom: 1px;
margin-right: 1px;
font-size:10px;
}

You may also like