function MakeGSImage(image){
    // если испортил (только у него есть фильтр) 
    if (typeof image.style.filter != "undefined") {
        // объект должен иметь лаяут
        image.style.zoom = 1;
        // делаем ч/б используя фильтр grayscale=1
        image.style.filter = 
            "progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);";
        // вешаем тригеры мыши
        image.onmouseover=function(){
            this.style.filter = 
                "progid:DXImageTransform.Microsoft.BasicImage(grayscale=0)";}
        image.onmouseout=function(){
            this.style.filter = 
                "progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)";}
    } else {
        // для функции grayscale практически идентично %)
        image.mouseOverImage=image.src;
        image.onload=function(){return true;};
        image.normalImage=grayscale(image, false);
        image.onmouseover=function(){this.src=this.mouseOverImage;}
        image.onmouseout=function(){this.src=this.normalImage;}
        image.src=image.normalImage;    
    }
}

function grayscale(image, bPlaceImage){
    // Создаём объект типа canvas.2d
  var myCanvas=document.createElement("canvas");
  var myCanvasContext=myCanvas.getContext("2d");
  // Делаем его размером с нашу картинку
  var imgWidth=image.width;
  var imgHeight=image.height;
  myCanvas.width= imgWidth;
  myCanvas.height=imgHeight;
  // Пихаем картинку в наш объект
  myCanvasContext.drawImage(image,0,0);
    // Заганяем попиксельно картинку в матрицу
  var imageData=myCanvasContext.getImageData(0,0, imgWidth, imgHeight);
  // Теперь в цикле, каждый пиксель мы делаем ч/б
  for (i=0; i<imageData.height; i++){
    for (j=0; j<imageData.width; j++){
          var index=(i*4)*imageData.width+(j*4);
          var red=imageData.data[index];      
          var green=imageData.data[index+1];
          var blue=imageData.data[index+2];   
          var alpha=imageData.data[index+3];     
          var average=(red+green+blue)*0.3333;    
          // Оставляем прозрачность и делим на среднее от RGB
            imageData.data[index]=average;
            imageData.data[index+1]=average;
            imageData.data[index+2]=average;
            imageData.data[index+3]=alpha;
        }
  }
  // Получаем чёрно-белую картинку
  myCanvasContext.putImageData(imageData,0,0,0,0, 
    imageData.width, imageData.height);
    // Вставляем чёрнобелую картинку
    // От параметра зависит куда вставляем
    // Либо рядом в div-ку, либо отдаём через return
  if (bPlaceImage){  
      var myDiv=document.createElement("div");  
      myDiv.appendChild(myCanvas);
      image.parentNode.appendChild(myCanvas);//, image);
  }
  return myCanvas.toDataURL();
}