title: Excanvas does not work in IE8
body: <p>Excanvas does not work in IE8!!! I write program to paint by mouse on canvas element. There are fragment of my js-code </p>
  
  <pre><code>window.attachEvent('onload', function () {
  
          function init() {
              var w = document.getElementById('signatureImage').getAttribute('width');
              var h = document.getElementById('signatureImage').getAttribute('height');
              var removeSignatureImage = document.getElementById('signatureImage');
              removeSignatureImage.parentNode.removeChild(removeSignatureImage);
              var canvasDiv = document.getElementById('canvasDiv');
              canvas = document.createElement('canvas');
              canvas.setAttribute('width', w);
              canvas.setAttribute('height', h);
              canvas.setAttribute('style', 'border:1px solid #000000');
              canvas.setAttribute('id', 'signatureImage');
              canvasDiv.appendChild(canvas);
  
              if (typeof G_vmlCanvasManager != 'undefined') {
                  canvas = window.G_vmlCanvasManager.initElement(canvas);
              }
              context = canvas.getContext("2d");
              tool = new tool_pencil();
              // Attach the mousedown, mousemove and mouseup event listeners.
              var trackend = false;
              var trackstart = false;
              var trackmid = false;
  
              canvas.onselectstart = function () {
                  canvas.onmousemove(); trackstart = true; 
              return false; }
              canvas.onclick = function () { trackend = true; }
              canvas.onmousemove = function () {
                  var mtarget = document.getElementById('signatureImage');
                  var x = event.clientX - canvas.offsetLeft;
                  var y = event.clientY - canvas.offsetTop;
                  var mtype = 'mousemove';
  
                  if (trackstart) {
                      trackstart = false;
                      trackmid = true;
                      mtype = 'mousedown';
                  }
  
                  if (trackend) {
                      trackmid = false;
                      mtype = 'mouseup';
                  }
  
                  if (trackend || trackmid || trackstart) {
                      trackend = false;
                      ev_canvas({
                          type: mtype,
                          _x: x,
                          _y: y,
                          target: mtarget
                      });
                  }
              }
          }
  
          function tool_pencil() {
              var tool = this;
              this.started = false;
  
              function getCoord(ev) {
                  var x = ev._x;
                  var y = ev._y;
  
                  if (tool.started == true) {
                      coords += x + "," + y + " ";
                  }
  
                  return [x, y];
              }
              this.mousedown = function (ev) {
                  context.beginPath();
                  context.moveTo(ev._x, ev._y);
                  tool.started = true;
  
              };
  
              this.mousemove = function (ev) {
                  if (tool.started) {
                      context.lineTo(ev._x, ev._y);
                      context.stroke();
                      var coord = getCoord(ev);
                  }
              };
  
              this.mouseup = function (ev) {
  
                  if (tool.started) {
                      tool.mousemove(ev);
                      tool.started = false;
                      coordList += coords + ";";
                      document.getElementById('coord').value = coordList;
                      coords = "";
  
                  }
              };
          }
  </code></pre>
  
  <p>When there is <code>context.lineTo(ev._x, ev._y);
                          context.stroke();</code> - nothing happens! Although the coordinates are passed and canvas painted and initialized</p>