$(document).ready(function(){
	var arrValues = ["#projects a", /* "#otherSelector a" */]; //each selector that we want a hover effect on
	$.each( arrValues, function(intIndex, objValue){
	  var i = 0; //counter
	  var count = $(objValue).size(); //figure out if its a list of images or on its lonesome
	  var thumbOver = new Array(); // where we will store the urls for each image
	  while(i <= count){
		thumbOver[i] = $(objValue).find("img").eq(i).attr("src"); //Get image url and assign it to 'thumbOver'
		$(objValue).eq(i).css({'background' : 'url(' + thumbOver[i] + ') no-repeat center bottom'}); //create a background image of the hover state behind the image
	    i++;
	  }
	  $(objValue).hover(
	    function() { $(this).find("img").stop().fadeTo('normal', 0 , function(){ $(this).hide() }); },  //fade out the image to reveal the background image
	 	function() { $(this).find("img").stop().fadeTo('normal', 1).show();	} //fade the image back in
	  );
	});	
 });