title: Firefox drawImage tinting image blue
body: <p>My client is experiencing a bizarre bug in Firefox 12 on Windows: a blue tinted box is appearing around the drawn image in the canvas.
  The canvas is inside an iframe inside a fancybox div. You may be able to see this in action by clicking the image thumbnail under the main image on this site:
  <a href="http://mattmatthias.com/a/index.php?route=product/product&amp;path=20&amp;product_id=80" rel="nofollow noreferrer">http://mattmatthias.com/a/index.php?route=product/product&amp;path=20&amp;product_id=80</a></p>
  
  <p>At first, I thought it was a selection issue, although the fact that the drawn image itself rather than the whole canvas seems to refute that. I've tried again and again to <code>blur</code> the canvas, the container div, the iframe... everything, to no avail.</p>
  
  <p>What's worse, I can't reproduce this bug. Everything functions normally in Safari, Firefox, Chrome, and Opera on my mac.</p>
  
  <p><img src="https://i.stack.imgur.com/KTQsU.jpg" alt="blue shade"></p>
  
  <p>This is probably the offending code, as it's the only part of the code that draws anything:</p>
  
  <pre><code>    if(imageWidth == 0) return;
  
      context.clearRect(0, 0, canvasWidth, canvasHeight);
  
  
  
      var x_adjust = -x-(ratio*canvasWidth    -canvasWidth        )/2;
      var y_adjust = -y-(ratio*canvasHeight   -canvasHeight       )/2;
  
      var width   = scaledWidth*ratio;
      var height  = scaledHeight*ratio;
  
  
      if(x_adjust &lt; canvasWidth - width)
          x_adjust = canvasWidth - width;
  
      if(x_adjust &gt; 0)
          x_adjust = 0;
  
      if(y_adjust &lt; canvasHeight - height)
          y_adjust = canvasHeight - height;
  
      if(y_adjust &gt; 0)
          y_adjust = 0;
  
  
      if(width &lt; canvasWidth) {
          x_adjust += (canvasWidth - width) / 2;
      }
      if(height &lt; canvasHeight) {
          y_adjust += (canvasHeight - height) / 2;
      }
  
  
      context.drawImage(image, 0, 0,
                        imageWidth, imageHeight,
                        x_adjust, y_adjust,
                        width, height);
  </code></pre>
  
  <p>Any ideas? As I get more details, I will post them here.</p>