Using Canvas globalCompositeOperation to reduce the amount of red, green or blue in an image

I’m writing an image editor (more as a learning curve for HTML5 Canvas rather than any other reason), and one function I’m getting stuck on is adjusting the RGB colours over the entire image.
Using three range sliders (for Red, Green and Blue), with the range going from -255 to +255, I call a function to add, or remove, the appropriate channels. Adding is easy, seemingly, by using the globalCompositeOperation of “lighter” and drawing a coloured rectangle over the entire image. However, reducing the appropriate channel is seeming to be a tad more difficult.
I had originally just set the colour of the rectangle to be full on with the other two channels, leaving the one we want to reduce as zero (with “lighter” being used). But this just made the image, well, lighter…as expected.
I’ve tried various other variations, with “difference” being the closest. However, go too far and it begins to add that channel to the darker regions.
I’ve also tried “darker”, as I thought it might be the opposite of “lighter”, but that doesn’t produce the desired result.
Maybe the answer is staring me in the face, but I just can’t see it.
The function is below:

function adjustColour()
{
 var value=0;
 var ctx=document.getElementById('theCanvas').getContext('2d');
 ctx.putImageData(originalPicData,0,0);
 for(var colour=0;colour<3;colour++)
 {
  if(colour==0)value=document.getElementById('adjustred').value;
  if(colour==1)value=document.getElementById('adjustgreen').value;
  if(colour==2)value=document.getElementById('adjustblue').value;
  if(value!=0)
  {
   if(value>0)
   {
    ctx.globalCompositeOperation='lighter';
    if(colour==0)ctx.fillStyle='rgb('+Math.abs(value)+',0,0)';
    if(colour==1)ctx.fillStyle='rgb(0,'+Math.abs(value)+',0)';
    if(colour==2)ctx.fillStyle='rgb(0,0,'+Math.abs(value)+')';
   }
   if(value<0)
   {
    ctx.globalCompositeOperation='difference';
    if(colour==0)ctx.fillStyle='rgb('+Math.abs(value)+',0,0)';
    if(colour==1)ctx.fillStyle='rgb(0,'+Math.abs(value)+',0)';
    if(colour==2)ctx.fillStyle='rgb(0,0,'+Math.abs(value)+')';
   }
   ctx.fillRect(0,0,image.width,image.height);
  }
 }
 ctx.globalCompositeOperation='source-over';
 displayImage();
}

Display Image just redraws and rescales the image to fit on the screen from the hidden canvas (“theCanvas”). And originalPicData is the original image grabbed before any manipulation (so we can restore it if Cancel is clicked on, for example).