Update new color in color picker
I have installed the jQuery plugin. Color picker: colpick.js and I don't know how to set a new color for the circle icon in the color palette (after refreshing the page, the bg element changed, but the circle icon in the palette is still in the default color area color:'003a7d
.it does not update.) ( However, the color picker and cookie work well.)
This is my code: html:
<div id="picker"></div>
JS:
if($.cookie('body_color')) {
$('body,.livebgchanger ul li a').css('background-color', $.cookie('body_color'));
}
else {
$('body,.livebgchanger ul li a').css('background-color', '#003a7d');
}
$('#picker').colpick({
flat:true,
submit:0,
layout:'full',
color:'003a7d', //default color
onChange:function(hsb,hex,rgb,el){
$('body,.livebgchanger ul li a').css('background-color', '#' + hex);
$.cookie('body_color', '#' + hex, { expires: 365 });
}
});
Before (I choose a new color and background color "body"): click to view image
After page refresh: (body background color changed, but circle icon and color in palette are in default color area) enter link here
How do I add this option and set a new color for the circle icon in the palette?
Sorry for my English. thank
source to share
You are hard-coding the default for the color picker. You have to pull the cookie value into a variable and use it to set background colors and colors.
var currColor = $.cookie('body_color') || '#003a7d';
$('body,.livebgchanger ul li a').css('background-color', currColor);
$('#picker').colpick({
flat: true,
submit: 0,
layout: 'full',
color: currColor.substring(1), //skip the #
onChange: function(hsb, hex, rgb, el) {
$('body,.livebgchanger ul li a').css('background-color', '#' + hex);
$.cookie('body_color', '#' + hex, {
expires: 365
});
}
});
source to share