let dog;

let man;

​

function preload() {

  cat = loadImage('image1.jpg');

  dog = loadImage('image3.jpg');

  man = loadImage('aa1.png');

}

​

function setup() {

  createCanvas(400, 400);

  pixelDensity(1);

}

​

function draw() {

​

​

  cat.loadPixels();

  //man.loadPixels();

  dog.loadPixels();

​

  loadPixels()

    for (let y = 0; y < height; y++) {

    for (let x = 0; x < width; x += 3) {

    let i = x +y * width * 4

      if (mouseX > 0 && mouseX < width / 2) {

        cat.pixels[i + 3] = 0;

​

        // let r7 = color(0, 0, 0, 0);

        // cat.set(x + 2, y, r7);

​

        // let r3 = color(0, 0, 0, 126);

        // man.set(x, y, r3);

​

      //aa  let r4 = color(0, 0, 0, 26);

     //aa   man.set(x + 2, y, r4);

​

        // let r5 = color(0, 0, 0,  0);

        // dog.set(x + 1, y, r5);

​

        let r6 = color(0, 0, 0, 0);

        dog.set(x + 2, y, r6);

​

        // let r8 = color(0, 0, 0, 0);

        // dog.set(x, y, r8);

​

​

​

      }

     else if (mouseX > width / 2  && mouseX < width) {

        // dog

        let r = color(0, 0, 0, 0);

        cat.set(x, y, r);

​

        let r2 = color(0, 0, 0, 0);

        cat.set(x + 1, y, r2);

​

        // let r7 = color(0, 0, 0, 0);

        // cat.set(x + 2, y, r7);

​

​

     //aa   let r3 = color(0, 0, 0, 26);

      //aa  man.set(x, y, r3);

​

        // let r8 = color(0, 0, 0, 0);

        // man.set(x + 1, y, r8);

​

     //aa   let r4 = color(0, 0, 0, 0);

       // aa  man.set(x + 2, y, r4);

​

        let r5 = color(0, 0, 0, 0);

        dog.set(x + 1, y, r5);

​

        let r6 = color(0, 0, 0,  126);

        dog.set(x + 2, y, r6);

​

​

​

​

      } 

}

​

    }

  }

​

 // updatePixels()

  cat.updatePixels();

 // man.updatePixels();

 // dog.updatePixels();

  image(cat, 0, 0);

 // image(man, 0, 0);

  image(dog, 0, 0);

​

​

​

​

​

​

//       let r = color(0, 0, 0, 0);

//       cat.set(x, y, r);

​

//       let r2 = color(0, 0, 0, 126);

//       cat.set(x + 1, y, r2);

​

​

//       let r3 = color(0, 0, 0, 126);

//       man.set(x, y, r3);

​

//       let r4 = color(0, 0, 0, 0);

//       man.set(x + 2, y, r4);

​

//       let r5 = color(0, 0, 0, 0);

//       dog.set(x + 1, y, r5);

​

//       let r6 = color(0, 0, 0, 126);

//       dog.set(x + 2, y, r6);

//   cat.updatePixels();

//   man.updatePixels();

//   dog.updatePixels();

//   image(cat, 0, 0);

//   image(man, 0, 0);

//   image(dog, 0, 0);