//Preload images
Group_BW     = new Image(418, 360);
Group_BW.src = "images/r5_group1_g0.jpg";

Group_CO     = new Image(418, 360);
Group_CO.src = "images/r5_group1_c0.jpg";

Group_C1     = new Image(418, 360);
Group_C1.src = "images/r5_group1_c1.jpg";

Group_C2     = new Image(418, 360);
Group_C2.src = "images/r5_group1_c2.jpg";

Group_C3     = new Image(418, 360);
Group_C3.src = "images/r5_group1_c3.jpg";

Group_C4     = new Image(418, 360);
Group_C4.src = "images/r5_group1_c4.jpg";

//Detail layer: default values; for everything else use CSS values
detailPositionRelativeMouseX = 10;
detailPositionRelativeMouseY = 1;

//Get the browser types
browserType_UN = 0;
browserType_IE = 1;
browserType_NS = 2;
browserType_FF = 3;

//Type of browser
thisBrowser    = getBrowserType();
if (thisBrowser == browserType_UN)
{
   event = null;
}

//Check for and return browser type
function getBrowserType()
{
   if (document.all)
      return browserType_IE;
   else
      return browserType_UN;   
}         

function setupDetailLayer()
{                
   //if (thisBrowser == browserType_IE) 
   //alert("before insert");
   document.body.insertAdjacentHTML("beforeEnd", '<DIV ID=detailInfo STYLE="visibility:hidden; position:absolute; width:250; height:0; left:0; top:0; z-index:100"></DIV>');
   //alert("after insert");

}

//Show the detail layer
function showDetails(evt, details)
{
   detailContent='<P class="detailInfoStyle">'+details+'</P>';				
   //if (thisBrowser == browserType_IE)
   //{

       var e=evt || event;
       var x = 0,y = 0;
       x = e.clientX;
       y = e.clientY;

      document.getElementById("detailInfo").style.top  = y + detailPositionRelativeMouseY;
      document.getElementById("detailInfo").style.left = x + detailPositionRelativeMouseX;
      document.getElementById("detailInfo").innerHTML = detailContent;
      document.getElementById("detailInfo").style.visibility = "visible";      
   //}
}

//Hide the detail layer
function hideDetails()
{
     //if (thisBrowser == browserType_IE)
        document.getElementById("detailInfo").style.visibility = "hidden";
}

//set image functions
function setImageGroupBW()
{
  document.group_c.src = Group_BW.src; 
  return true;
}

//set image functions
function setImageGroupCO()
{
  document.group_c.src = Group_CO.src; 
  return true;
}

function setImageGroupC1()
{
  document.group_c.src = Group_C1.src; 
  return true;
}

function setImageGroupC2()
{
  document.group_c.src = Group_C2.src;
  return true;
}

function setImageGroupC3()
{
  document.group_c.src = Group_C3.src; 
  return true;
}

function setImageGroupC4()
{
  document.group_c.src = Group_C4.src; 
  return true;
}