I'm trying to play around with the Farbtastic: color picker plugin but I'm having some issues.

I want to setup a callback function so that I can change the bg color like so:

  $('#picker').farbtastic(function(){
    $("body").css("background-color",$.farbtastic('#picker').color);
  });

This works fine, but by doing this, the input field no longer updates the hex value in real time.

How can I make it so the hex value within the input field AND the body background color update both at the same time?

Thanks

I'm trying to play around with the Farbtastic: http://acko/dev/farbtastic color picker plugin but I'm having some issues.

I want to setup a callback function so that I can change the bg color like so:

  $('#picker').farbtastic(function(){
    $("body").css("background-color",$.farbtastic('#picker').color);
  });

This works fine, but by doing this, the input field no longer updates the hex value in real time.

How can I make it so the hex value within the input field AND the body background color update both at the same time?

Thanks

• javascript
• jquery

3 Answers 3

Assuming that the id of the input is 'color'. Does this work for you?

$('#picker').farbtastic(function() {
  $("body").css("background-color",$.farbtastic('#picker').color);
  $("#color").val($.farbtastic('#picker').color);});

i'm trying with this , worked ;)

$('#picker').farbtastic('#color_picker_input').mouseup(function (){
    $("body").css("background-color",$.farbtastic('#picker').color);      
});

You can get the color as an argument to the callback:

$('#colorpicker').farbtastic(function(color){...