使用 ColorPicker 将字体颜色设置为 div

Question

So, I used this jscolor to pick my color: http://jscolor.com/ Works just fine for php purposes, but I want my divs with class "color-font" to respond to whatever color I pick. Meaning, I want divs with class "color-font" to change their font-color as I pick color from that palette.

I am using ColorPicker to make divs change their font, and it does not work. Link to color picker: http://www.eyecon.ro/colorpicker/

Here is what I have as far as code:

This is input palette:

<input type="text" size="1" name="color_font" id="color_font" value="<?php echo $t_content["color_font"]["content"]; ?>" style="font-size: 0px;  background-color: <?php echo $t_content["color_font"]["content"]; ?>; color: <?php echo $t_content["color_font"]["content"]; ?>;" class="color {hash:true}" /> 

Here is the javascript code Where I am trying to pick the color from input with ID = "color_font" and set it in divs with class = "color-font"

$('#color_font').ColorPicker({
    //color: $(this).val(),

    onBeforeShow: function() {
        $('#color_font').ColorPickerSetColor($('#color_font').val());
    },
    onChange: function(hsb, hex, rgb) {
        var element_p = $('#color_font');
        var old_color_accent = $('#color_font').css('color');

        $('.color-font').each(function() { $(this).css('color', '#' + hex); });


        element_p.css('background-color', '#' + hex);
        element_p.css('color', '#' + hex);
        element_p.val('#' + hex);
    },
    onSubmit: function(hsb, hex, rgb, el) {
        $('#color_font').ColorPickerHide();
    }
});

I don't understand why it does not work.

Answer 1

You can register the chosen color in the database, in your system you seek the result of the chosen color and shows this result in style sheet that will be in php format. You can not get the style sheet in another file, you can have a php file with the stylesheet and include this file in your pages. You need to create a php file with the style sheet which is expected to be the class of the div that will have the color you choose.

example your_page.php :

       <style type="text/css">
        .my_color{
            color: <?php echo $mycolor; ?>;
            background: <?php echo $mybackground; ?>;
        }
        </style>


<div class="my_color">
This is my color!
</div>