selcolor.htm 7.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301
  1. <HTML>
  2. <HEAD>
  3. <META content="text/html; charset=gb2312" http-equiv=Content-Type>
  4. <STYLE type=text/css>
  5. TD {FONT-SIZE: 10.8pt}
  6. BODY {FONT-SIZE: 10.8pt}
  7. BUTTON {WIDTH: 5em}
  8. </STYLE>
  9. <SCRIPT LANGUAGE=JAVASCRIPT SRC="dialog.js"></SCRIPT>
  10. <SCRIPT language=JavaScript>
  11. var sAction = URLParams['action'] ;
  12. var sTitle = "";
  13. var color = "" ;
  14. var oSelection;
  15. var oControl;
  16. var sRangeType;
  17. switch (sAction) {
  18. case "forecolor": // 字体前景色
  19. sTitle = "字体前景色";
  20. oSelection = dialogArguments.eWebEditor.document.selection.createRange();
  21. color = oSelection.queryCommandValue("ForeColor");
  22. if (color) color = N2Color(color);
  23. break;
  24. case "backcolor": // 字体背景色
  25. sTitle = "字体背景色";
  26. oSelection = dialogArguments.eWebEditor.document.selection.createRange();
  27. color = oSelection.queryCommandValue("BackColor");
  28. if (color) color = N2Color(color);
  29. break;
  30. case "bgcolor": // 对象背景色
  31. sTitle = "对象背景色";
  32. oSelection = dialogArguments.eWebEditor.document.selection.createRange();
  33. sRangeType = dialogArguments.eWebEditor.document.selection.type;
  34. if (sRangeType == "Control") {
  35. oControl = GetControl(oSelection, "TABLE");
  36. }else{
  37. oControl = GetParent(oSelection.parentElement());
  38. }
  39. if (oControl) {
  40. switch(oControl.tagName){
  41. case "TD":
  42. sTitle += " - 单元格";
  43. break;
  44. case "TR":
  45. case "TH":
  46. sTitle += " - 表格行";
  47. break;
  48. default:
  49. sTitle += " - 表格";
  50. break;
  51. }
  52. color = oControl.bgColor;
  53. }else{
  54. sTitle += " - 网页";
  55. }
  56. break;
  57. default: // 其它颜色框
  58. if (URLParams['color']){
  59. color = decodeURIComponent(URLParams['color']) ;
  60. }
  61. break;
  62. }
  63. document.write("<TITLE>颜色选择(" + sTitle + ")</TITLE>");
  64. // 默认显示值
  65. if (!color) color = "#000000";
  66. // 返回有背景颜色属性的对象
  67. function GetParent(obj){
  68. while(obj!=null && obj.tagName!="TD" && obj.tagName!="TR" && obj.tagName!="TH" && obj.tagName!="TABLE")
  69. obj=obj.parentElement;
  70. return obj;
  71. }
  72. // 返回标签名的选定控件
  73. function GetControl(obj, sTag){
  74. obj=obj.item(0);
  75. if (obj.tagName==sTag){
  76. return obj;
  77. }
  78. return null;
  79. }
  80. // 数值转为RGB16进制颜色格式
  81. function N2Color(s_Color){
  82. s_Color = s_Color.toString(16);
  83. switch (s_Color.length) {
  84. case 1:
  85. s_Color = "0" + s_Color + "0000";
  86. break;
  87. case 2:
  88. s_Color = s_Color + "0000";
  89. break;
  90. case 3:
  91. s_Color = s_Color.substring(1,3) + "0" + s_Color.substring(0,1) + "00" ;
  92. break;
  93. case 4:
  94. s_Color = s_Color.substring(2,4) + s_Color.substring(0,2) + "00" ;
  95. break;
  96. case 5:
  97. s_Color = s_Color.substring(3,5) + s_Color.substring(1,3) + "0" + s_Color.substring(0,1) ;
  98. break;
  99. case 6:
  100. s_Color = s_Color.substring(4,6) + s_Color.substring(2,4) + s_Color.substring(0,2) ;
  101. break;
  102. default:
  103. s_Color = "";
  104. }
  105. return '#' + s_Color;
  106. }
  107. // 初始值
  108. function InitDocument(){
  109. ShowColor.bgColor = color;
  110. RGB.innerHTML = color;
  111. SelColor.value = color;
  112. }
  113. var SelRGB = color;
  114. var DrRGB = '';
  115. var SelGRAY = '120';
  116. var hexch = new Array('0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F');
  117. function ToHex(n) {
  118. var h, l;
  119. n = Math.round(n);
  120. l = n % 16;
  121. h = Math.floor((n / 16)) % 16;
  122. return (hexch[h] + hexch[l]);
  123. }
  124. function DoColor(c, l){
  125. var r, g, b;
  126. r = '0x' + c.substring(1, 3);
  127. g = '0x' + c.substring(3, 5);
  128. b = '0x' + c.substring(5, 7);
  129. if(l > 120){
  130. l = l - 120;
  131. r = (r * (120 - l) + 255 * l) / 120;
  132. g = (g * (120 - l) + 255 * l) / 120;
  133. b = (b * (120 - l) + 255 * l) / 120;
  134. }else{
  135. r = (r * l) / 120;
  136. g = (g * l) / 120;
  137. b = (b * l) / 120;
  138. }
  139. return '#' + ToHex(r) + ToHex(g) + ToHex(b);
  140. }
  141. function EndColor(){
  142. var i;
  143. if(DrRGB != SelRGB){
  144. DrRGB = SelRGB;
  145. for(i = 0; i <= 30; i ++)
  146. GrayTable.rows(i).bgColor = DoColor(SelRGB, 240 - i * 8);
  147. }
  148. SelColor.value = DoColor(RGB.innerText, GRAY.innerText);
  149. ShowColor.bgColor = SelColor.value;
  150. }
  151. </SCRIPT>
  152. <SCRIPT event=onclick for=ColorTable language=JavaScript>
  153. SelRGB = event.srcElement.bgColor;
  154. EndColor();
  155. </SCRIPT>
  156. <SCRIPT event=onmouseover for=ColorTable language=JavaScript>
  157. RGB.innerText = event.srcElement.bgColor;
  158. EndColor();
  159. </SCRIPT>
  160. <SCRIPT event=onmouseout for=ColorTable language=JavaScript>
  161. RGB.innerText = SelRGB;
  162. EndColor();
  163. </SCRIPT>
  164. <SCRIPT event=onclick for=GrayTable language=JavaScript>
  165. SelGRAY = event.srcElement.title;
  166. EndColor();
  167. </SCRIPT>
  168. <SCRIPT event=onmouseover for=GrayTable language=JavaScript>
  169. GRAY.innerText = event.srcElement.title;
  170. EndColor();
  171. </SCRIPT>
  172. <SCRIPT event=onmouseout for=GrayTable language=JavaScript>
  173. GRAY.innerText = SelGRAY;
  174. EndColor();
  175. </SCRIPT>
  176. <SCRIPT event=onclick for=Ok language=JavaScript>
  177. color = SelColor.value;
  178. if (!IsColor(color)){
  179. alert('无效的颜色值!');
  180. return;
  181. }
  182. switch (sAction) {
  183. case "forecolor":
  184. dialogArguments.format('ForeColor', color) ;
  185. window.returnValue = null;
  186. break;
  187. case "backcolor":
  188. dialogArguments.format('BackColor', color) ;
  189. window.returnValue = null;
  190. break;
  191. case "bgcolor":
  192. if (oControl){
  193. oControl.bgColor = color;
  194. }else{
  195. dialogArguments.setHTML("<table border=0 cellpadding=0 cellspacing=0 width='100%' height='100%'><tr><td valign=top bgcolor='"+color+"'>"+dialogArguments.getHTML()+"</td></tr></table>");
  196. }
  197. window.returnValue = null;
  198. break;
  199. default:
  200. window.returnValue = color;
  201. break;
  202. }
  203. window.close();
  204. </SCRIPT>
  205. </HEAD>
  206. <BODY bgColor=menu onload="InitDocument()">
  207. <DIV align=center>
  208. <CENTER>
  209. <TABLE border=0 cellPadding=0 cellSpacing=10>
  210. <TBODY>
  211. <TR>
  212. <TD>
  213. <TABLE border=0 cellPadding=0 cellSpacing=0 id=ColorTable style="CURSOR: hand">
  214. <SCRIPT language=JavaScript>
  215. function wc(r, g, b, n){
  216. r = ((r * 16 + r) * 3 * (15 - n) + 0x80 * n) / 15;
  217. g = ((g * 16 + g) * 3 * (15 - n) + 0x80 * n) / 15;
  218. b = ((b * 16 + b) * 3 * (15 - n) + 0x80 * n) / 15;
  219. document.write('<TD BGCOLOR=#' + ToHex(r) + ToHex(g) + ToHex(b) + ' height=8 width=8></TD>');
  220. }
  221. var cnum = new Array(1, 0, 0, 1, 1, 0, 0, 1, 0, 0, 1, 1, 0, 0, 1, 1, 0, 1, 1, 0, 0);
  222. for(i = 0; i < 16; i ++){
  223. document.write('<TR>');
  224. for(j = 0; j < 30; j ++){
  225. n1 = j % 5;
  226. n2 = Math.floor(j / 5) * 3;
  227. n3 = n2 + 3;
  228. wc((cnum[n3] * n1 + cnum[n2] * (5 - n1)),
  229. (cnum[n3 + 1] * n1 + cnum[n2 + 1] * (5 - n1)),
  230. (cnum[n3 + 2] * n1 + cnum[n2 + 2] * (5 - n1)), i);
  231. }
  232. document.writeln('</TR>');
  233. }
  234. </SCRIPT>
  235. <TBODY></TBODY></TABLE></TD>
  236. <TD>
  237. <TABLE border=0 cellPadding=0 cellSpacing=0 id=GrayTable style="CURSOR: hand">
  238. <SCRIPT language=JavaScript>
  239. for(i = 255; i >= 0; i -= 8.5)
  240. document.write('<TR BGCOLOR=#' + ToHex(i) + ToHex(i) + ToHex(i) + '><TD TITLE=' + Math.floor(i * 16 / 17) + ' height=4 width=20></TD></TR>');
  241. </SCRIPT>
  242. <TBODY></TBODY></TABLE></TD></TR></TBODY></TABLE></CENTER></DIV>
  243. <DIV align=center>
  244. <CENTER>
  245. <TABLE border=0 cellPadding=0 cellSpacing=10>
  246. <TBODY>
  247. <TR>
  248. <TD align=middle rowSpan=2>选中色彩
  249. <TABLE border=1 cellPadding=0 cellSpacing=0 height=30 id=ShowColor width=40 bgcolor="">
  250. <TBODY>
  251. <TR>
  252. <TD></TD></TR></TBODY></TABLE></TD>
  253. <TD rowSpan=2>基色: <SPAN id=RGB></SPAN><BR>亮度: <SPAN
  254. id=GRAY>120</SPAN><BR>代码: <INPUT id=SelColor size=7 value=""></TD>
  255. <TD><BUTTON id=Ok type=submit>确定</BUTTON></TD></TR>
  256. <TR>
  257. <TD><BUTTON onclick=window.close();>取消</BUTTON></TD></TR></TBODY></TABLE></CENTER></DIV>
  258. </BODY></HTML>