Wednesday, September 19, 2012

Design a HTML color picker



Design a HTML color picker:
http://swf.site40.net/colorpicker/
or
http://www.jiansenlu.zoka.cc/colorpicker/ 

1) You can enter your color code to display the color in input
or
2) pickup the color from the box under input, the color code will be display in input.

The code is modified from js color library:
http://jscolor.com/

in jscolor.js: line 572 change
    function removePicker() {
          delete jscolor.picker.owner;
           document.getElementsByTagName('body')[0].removeChild(jscolor.picker.boxB);
        }

to
    function removePicker() {
        //    delete jscolor.picker.owner;
        //    document.getElementsByTagName('body')[0].removeChild(jscolor.picker.boxB);
        }


line 907 change
        // target
        jscolor.addEvent(target, 'focus', function() {
            if(THIS.pickerOnfocus) { THIS.showPicker(); }
        });

to
        THIS.showPicker();
        // target
        jscolor.addEvent(target, 'focus', function() {
            if(THIS.pickerOnfocus) { THIS.showPicker(); }
        });

No comments:

Post a Comment