Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

altField text color changing depending on background-color #121

Open
xxvikxx opened this issue Feb 19, 2016 · 0 comments
Open

altField text color changing depending on background-color #121

xxvikxx opened this issue Feb 19, 2016 · 0 comments

Comments

@xxvikxx
Copy link

xxvikxx commented Feb 19, 2016

First, thanks for writing this. I have one additional feature I would like to integrate: for altField, I modified the code so that if the selected color is darker, the text value will show up lighter and if the selected color is lighter, the text will show up darker. I do this by utilizing a CSS class on my altField; if the selected color is above a certain threshold it adds the class colorPickerLight and if not it removes it. I renamed the attachment to .txt so github would accept it.
jquery.colorpicker.txt

CSS:

<style type="text/css">
    .colorPicker
    {
        text-align: right;
        width: 140px;
        color: #000000;
    }
    .colorPickerLight
    {
        color: #ffffff !important;
    }
</style>

Javascript:

<script type="text/javascript">
    $(document).ready(
        function ()
        {
            $("#firstColorPicker").colorpicker({
                altField: "#firstColorPicker",
                altProperties: "background-color, color",
                colorFormat: "#HEX",
                draggable: false, hsv: false, okOnEnter: true,
                parts: ['map', 'bar', 'hex', 'rgb', 'preview', 'swatches']
            });
        }
    );
</script>

HTML:
<input type="text" class="colorPicker" id="firstColorPicker" value="#ff6a6a" readonly="readonly" />
jquery.colorpicker.txt

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant