Open Befuddled-Monkey opened 1 month ago
Do you mean, after user picked a color?
Yes! I tried every classical method I found, nothing is working. I'm a beginner, so much of this is kind of Chinese to me.
I guess it has to do with this line?
document.querySelector('lccp_gradient:not('lccp_gradient-bg').style.background = active_gradient;
You have to use the on_change
parameter
new lc_color_picker('input', {
// (function) triggered every time field value changes. Passes value and target field object as parameters
on_change : function(new_value, target_field) {
// target DIV and apply color
},
});
Must be something like this? But what do I do with target_value?
new lc_color_picker('input[name="simple"]', {
modes : ['solid'],
transparency : true,
open_on_focus : true,
wrap_width : '100%',
preview_style : {
input_padding : 45,
side : 'left',
width : 40,
},
fallback_colors : ['rgb(115, 26, 244)'],
on_change : function(new_value, target_field) {
var bggg = document.getElementsById('body_bggg');
bggg.style.backgroundColor = new_value;
},
});
I don't blame you if you are in a facepalm session now, but please give me something more explicit to go on.
What is "target_value"? Your code is correct
on_change : function(new_value, target_field) {
var bggg = document.getElementsById('body_bggg');
bggg.style.backgroundColor = new_value;
},
should work fine
Upss, sorry, I meant target_field. How do I use target_field in this? And it doesn't work. Div 'body_bggg' doesn't change color.
I got it to work with the 'simple' input.
HTML code:
<input type="text" name="simple" id="simple" value="rgba(115, 26, 244, 0.66)" onkeypress="changeColor()" />
<div id="body_bggg" class="body_bggg">blahahaha</div>
Javascript:
function changeColor(){
var bggg = document.querySelector('#body_bggg');
bggg.style.backgroundColor = document.querySelector("#simple").value;
};
I tried to apply the same logic to the 'full' input, but the div color doesn't change.
How do I also apply the color change to a div?