JavaScript не работает в ie
 

Привет всем, прошу помочь в следующей ситуации, код работает во всех браузерах кроме ie должен получиться эффект стирания.

код расположенный в index.php

<div id="car-box">
                                              <div class="block-in">              
                                        <script src="templates/beez_20/javascript/cleaning.js" type="text/javascript">
                                        </script>
              <div style='width:846px; height:446px; position:relative' padding-left: 10px' id='cover'
              onmousemove='try {draw((event.offsetX||event.layerX), (event.offsetY||event.layerY))} catch(e) {}'
              onmouseover='{X=0; Y=0}'></div>
              <script type="text/javascript">
              var dirty = new Image(), clean = new Image(), carsLoad=0;
              //
              clean.src = 'templates/beez_20/images/clean.png';
              dirty.src = 'templates/beez_20/images/dirty.png';
              d = 75; //
              window.onload = initCanvas
              </script>
              <div class="legs"></div>
              <div class="links">
              <div style="padding: 10px;"></div>
                <a href="javascript:clearAll()" class="make-clean"><span>Помыть</span></a>
                <span style="padding-left: 10px;"> | </span>
                <span style="padding-left: 10px;"></span>
                <a href="javascript:blurAll()" class="make-dirty"><span>Испачкать</span></a>
             
              </div></div>
            </div><p/></center>

а вот собственно код фала

function el(id) {return document.getElementById(id)};
function initCanvas() {
  X=0; Y=0; r=d/2;
  var car = document.createElement('canvas');
  car.height=el('cover').offsetHeight;
  car.width=el('cover').offsetWidth;
  if (car.getContext) {
  ctx = car.getContext('2d');
  ctx.strokeStyle=ctx.createPattern(clean, 'no-repeat');
  ctx.fillStyle=ctx.createPattern(clean, 'no-repeat');
   draw=function(x, y) {
    ctx.lineWidth=1;
    ctx.beginPath();
    ctx.arc(x, y, r, 0, Math.PI*2, false);
    ctx.fill();
    ctx.closePath();
    if ((X==0)&&(Y==0)) {X=x; Y=y; return;};
    ctx.lineWidth=d;
    ctx.beginPath();
    ctx.moveTo(x, y);
    ctx.lineTo(X, Y);
    ctx.stroke();
    ctx.closePath();
    X=x; Y=y;
   };
  clearAll=function() {void(ctx.drawImage(clean, 0, 0))};
  blurAll=function() {void(ctx.clearRect (0, 0, el('cover').offsetWidth, el('cover').offsetHeight))};
  } else {
  car = document.createElement('div');
  clearAll=function() {car.innerHTML=''; car.style.background='url('+clean.src+')'};
  blurAll=function() {car.innerHTML=''; car.style.background='url('+dirty.src+')'};
  draw=function(x, y) {
    var div = document.createElement('div');
    div.className='arc';
    div.style.left=x-r+"px";
    div.style.top=y-r+"px";
    div.style.width=d+"px";
    div.style.height=d+"px";
    div.style.backgroundPosition=(r-x)+"px "+(r-y)+"px";
    el('car').appendChild(div);
  }
  }
  el('cover').parentNode.insertBefore(car, el('cover'));
  car.id='car';
  car.style.position="absolute";
  car.style.background='url('+dirty.src+')';
  car.style.left=el('cover').offsetLeft+"px";
  car.style.top=el('cover').offsetTop+"px";
  car.style.width=el('cover').offsetWidth+"px";
  car.style.height=el('cover').offsetHeight+"px";
}