I messed around with your code a bit, and I found something that I think is what you had in mind as far as that effect goes:

Code:

int size = 30; 
int numFrames = 4;  // The number of frames in the animation 
int frame = 0; 
int fill_alpha = 0;
final int STEP = 4; // Change this to whatever works to your desired effect
PImage[] images = new PImage[numFrames]; 
 
void setup() { 
  size(500, 500); 

//  frameRate(5);
  images[0]  = loadImage("http://www.tierarche.de/images/karten/anfahrt-wildgatter-grob.500x500.gif"); 
  images[1]  = loadImage("http://www.tierarche.de/images/karten/anfahrt-wildgatter-fein.500x500.gif");  
  images[2]  = loadImage("http://www.autoelectric.ru/tuning/pak2/pak-2-500x500.gif"); 
  images[3]  = loadImage("http://www.highpeakcvs.org/MagicCarpet/MagicCarpet-Graphics/Map-MagicCar pet-Buxton-500x500.gif");  
}  
 
void draw() { 
  image(images[frame], 0, 0);
  if(fill_alpha > 0)
  {
    fill_alpha -= STEP;
  }
  fill(0,0,0, fill_alpha);
  rect(0,0,width,height);
} 

void mousePressed()
{
 frame = (frame+1)%numFrames;
 fill_alpha = 255; 
} 
 

Using the mousePressed() function, the alpha fill is reset to opaque every time the mouse is clicked. That fill value is continueously diminished within the draw() function by a constant, STEP, which you can define to whatever makes it look best.

One thing to watch out for is that the fourth image, I believe, is loading from a dead image URL, so if you get a NullPointerException, that's why.

Hope this helps ^_^