var htmax=265;          //set maximum height image (px)
var htmin = 0;
var wdmin=3;            //set minimum thickness of edge-on image (px)
var wdmax=190
var inc=5;              //set step change in px (wdmax-wdmin must be a multiple)These two variables
var rate = 52;          //pause between steps (in millisec) determine flip-flop speed
var pause = 1000;       //pause between flip and flop (in millisec)
var ff="flip";          //initialise whether movement starts with a "flip" (sideways) or "flop" (vertical) change.
var counter=0;
var image3D1 = "images/Marely.jpg";
var image3D2 = "images/Clinton.jpg";
	
function flipflop() 
{

  if (ff=="flip") 
  {
     var wd = document.getElementById("crystalImage").getAttribute("width");
     wd = wd - inc;
     document.getElementById("crystalImage").setAttribute("width",wd);

     if (wd < wdmin) 
	 {
        document.getElementById("crystalImage").setAttribute("src", image3D2); //substitute name of your second picture
        inc=-inc;
     }

     if (wd >= wdmax) 
	 {
        ff="flop";
        inc=-inc;
		counter++;
		if (counter >= 5)
		{
			image3D1 = "images/Wedding.jpg";
			image3D2 = "images/ButterFly.jpg";
			if (counter >= 11)
			{
				counter = 0;
			}
		}
		else
		{
			image3D1 = "images/Marely.jpg";
			image3D2 = "images/Clinton.jpg";
		}
        setTimeout("flipflop()",pause);
     }
     else 
	 {
        setTimeout("flipflop()",rate);
     }
  }
  else 
  {
     var ht = document.getElementById("crystalImage").getAttribute("height");
     ht = ht - inc;
     document.getElementById("crystalImage").setAttribute("height",ht);
     if (ht == htmin) 
	 {
        document.getElementById("crystalImage").setAttribute("src", image3D1); //substitute name of your first picture
        inc=-inc;
     } 
     if (ht==htmax) 
	 {
        ff="flip";
        inc=-inc;
		counter++;
		if (counter >= 5)
		{
			image3D1 = "images/Wedding.jpg";
			image3D2 = "images/ButterFly.jpg";
			if (counter >= 11)
			{
				counter = 0;
			}
		}
		else
		{
			image3D1 = "images/Marely.jpg.jpg";
			image3D2 = "images/Clinton.jpg";
		}
        setTimeout("flipflop()",pause);
     }
     else 
	 {
        setTimeout("flipflop()",rate);
     }
  }
}
