colorpicker.js 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354
  1. var ColorHex=new Array('00','33','66','99','CC','FF')
  2. var SpColorHex=new Array('FF0000','00FF00','0000FF','FFFF00','00FFFF','FF00FF')
  3. var current=null
  4. var colorTable=''
  5. function colorpicker(showid,fun) {
  6. for (i=0;i<2;i++) {
  7. for (j=0;j<6;j++) {
  8. colorTable=colorTable+'<tr height=12>'
  9. colorTable=colorTable+'<td width=11 onmouseover="onmouseover_color(\'000\')" onclick="select_color(\''+showid+'\',\'000\','+fun+')" style="background-color:#000">'
  10. if (i==0){
  11. colorTable=colorTable+'<td width=11 onmouseover="onmouseover_color(\''+ColorHex[j]+ColorHex[j]+ColorHex[j]+'\')" onclick="select_color(\''+showid+'\',\''+ColorHex[j]+ColorHex[j]+ColorHex[j]+'\','+fun+')" style="background-color:#'+ColorHex[j]+ColorHex[j]+ColorHex[j]+'">'
  12. } else {
  13. colorTable=colorTable+'<td width=11 onmouseover="onmouseover_color(\''+SpColorHex[j]+'\')" onclick="select_color(\''+showid+'\',\''+SpColorHex[j]+'\','+fun+')" style="background-color:#'+SpColorHex[j]+'">'}
  14. colorTable=colorTable+'<td width=11 onmouseover="onmouseover_color(\'000\')" onclick="select_color(\''+showid+'\',\'000\','+fun+')" style="background-color:#000">'
  15. for (k=0;k<3;k++) {
  16. for (l=0;l<6;l++) {
  17. colorTable=colorTable+'<td width=11 onmouseover="onmouseover_color(\''+ColorHex[k+i*3]+ColorHex[l]+ColorHex[j]+'\')" onclick="select_color(\''+showid+'\',\''+ColorHex[k+i*3]+ColorHex[l]+ColorHex[j]+'\','+fun+')" style="background-color:#'+ColorHex[k+i*3]+ColorHex[l]+ColorHex[j]+'">'
  18. }
  19. }
  20. }
  21. }
  22. colorTable='<div style="position:relative;width:253px; height:176px"><a href="javascript:;" onclick="closeBox();" class="close-own">X</a><table width=253 border="0" cellspacing="0" cellpadding="0" style="border:1px #000 solid;border-bottom:none;border-collapse: collapse" bordercolor="000000">'
  23. +'<tr height=30><td colspan=21 bgcolor=#eeeeee>'
  24. +'<table cellpadding="0" cellspacing="1" border="0" style="border-collapse: collapse">'
  25. +'<tr><td width="3"><td><input type="text" name="DisColor" size="6" id="background_colorId" disabled style="border:solid 1px #000000;background-color:#ffff00"></td>'
  26. +'<td width="3"><td><input type="text" name="HexColor" size="7" id="input_colorId" style="border:inset 1px;font-family:Arial;" value="#000000"></td><td><a href="javascript:;" onclick="clear_title();"> clear</a></td></tr></table></td></table>'
  27. +'<table border="1" cellspacing="0" cellpadding="0" style="border-collapse: collapse" bordercolor="000000" style="cursor:hand;">'
  28. +colorTable+'</table></div>';
  29. $('#'+showid).html(colorTable);
  30. colorTable = '';
  31. }
  32. function onmouseover_color(color) {
  33. var color = '#'+color;
  34. $('#background_colorId').css('background-color',color);
  35. $('#input_colorId').val(color);
  36. }
  37. function select_color(showid,color,fun) {
  38. var color = '#'+color;
  39. //$('#title').css('color',color);
  40. if(fun) {
  41. fun.apply(this,[color]);
  42. }
  43. $('#'+showid).html(' ');
  44. }
  45. function closeBox(){
  46. $(".colorpanel").html(' ');
  47. }
  48. function clear_title() {
  49. set_title_color('');
  50. $('#title_colorpanel').html(' ');
  51. }