Search code examples
jqueryhtmlattrcolor-picker

Get HEX value from farbtastic color picker and add it to html tag attribute

So, what I would like to do is:

I have color-picker "farbtastic" which works great. Later in code I have "img" element with attribute from another plugin for image manipulation. I would like to set farbtastic HEX value like an attribute to this img tag. I tried following:

    <script type="text/javascript">
        $(document).ready(function() {
        var picker = $.farbtastic('#picker');
        picker.linkTo(function onColorChange(color) {
        $('filter-tint').attr('data-pb-tint-colour',color)
        });
    });
    </script>

And this is my img tag:

    <img id="filter-tint" class="filter-tint" src="img/barva.png" data-pb-tint-opacity="1" data-pb-tint-colour="#ffffff"/>

Please help, I've tried passing this value for days now, but with no luck :(

Solution

  • You are missing # for the ID selector:

    $('filter-tint').attr('data-pb-tint-colour',color)
// ^----