
/* fadein and out  *********************   */

function fadeIn(objId,opacity)
{
  if (document.getElementById)
  {
    obj = document.getElementById(objId);
    if (opacity <= 100)
    {
      setOpacity(obj, opacity);
      opacity += 5;
      window.setTimeout("fadeIn('"+objId+"',"+opacity+")", 100);

    }
  }
}

function fadeOut(objId,opacity)
{
  if (document.getElementById)
  {
    obj = document.getElementById(objId);
    if (opacity >= 0)
    {
      setOpacity(obj, opacity);
      opacity -= 5;
      window.setTimeout("fadeOut('"+objId+"',"+opacity+")", 100);
    }
  }
}


function initImage()
{
  imageId = 'thephoto';
  image = document.getElementById(imageId);
  setOpacity(image, 0);
  image.style.visibility = "visible";
  fadeIn(imageId,0);
}



function setOpacity(obj, opacity)
{
  opacity = (opacity == 100)?99.999:opacity;
  // IE/Win
  obj.style.filter = "alpha(opacity:"+opacity+")";
  // Safari<1.2, Konqueror
  obj.style.KHTMLOpacity = opacity/100;
  // Older Mozilla and Firefox
  obj.style.MozOpacity = opacity/100;
  // Safari 1.2, newer Firefox and Mozilla, CSS3
  obj.style.opacity = opacity/100;
}


//used to auto fade in and out
function changer()
{
  fadeOut('thephoto',100);
  // pausecomp(50000);
  // alb_index_page();
  document.getElementById('photo2').innerHTML='<img src=\'1bed.jpg\' alt=\'Photo2\' id=\'thephoto2\' />'
  fadeIn('thephoto2',0);
  setTimeout('alb_index_page()', 3000);
}


/* text fade in and out  *********************   */

function show_toptext3(thetext)
{
  document.getElementById('fade_text').innerHTML='<b>'+thetext+'</b>' 
  document.getElementById('fade_text').style.color="#FFFF00"; 
  fade();
}

function fade_text(thetext)
{
  document.getElementById('fade_text').innerHTML='<b>'+thetext+'</b>' 
  document.getElementById('fade_text').style.color="#FFFF00"; 
  fade();
}

R=255;
G=255;
B=0;

function fade()
{
  document.getElementById("fade_text").style.color="rgb(" + R + "," + G + "," + B + ")"; 
  R-=10; 
  G-=8;
  B+=6;

  if (R>43 || G >73 || B <123 )
  {
    setTimeout('fade()', 40); 
  } else
  {

    R=255;
    G=255;
    B=0;
  }

}

    /*   color: #2B497B; 
43
 73
 123
*/


/*
see fadeintest.htm

style holders
#photoholder {
  width:799px;
  height:643px;
   
}
#thephoto {
  width:799px;
  height:630px;
}  

html
   <div slign="center" id='photoholder'> <img src='../images/canyon1.jpg' alt='Photo' id='thephoto'onClick=" fadeOut('thephoto',100); window.setTimeout('redirect(index)', 3000);" /></div>

in the header
var index = "index.htm";
document.write("<style type='text/css'>#thephoto {visibility:hidden;}</style>");

window.onload = function() {initImage()}
   
   
   */



//nav utilities ***************************

function redirect(loc)
{
  location.replace(loc);

}

/*


function init() {

activateMenu('nav'); 
alb_show_enl(0);
//highlight_img(261,1);
//fade_text(261);
pagenum_launch(toplev);
}
*/


/* this method gets an element by its name.
its called by: onmouseover="highlight_img(\'' + i +'\')"
it can be performed by: onmouseover="this.style.borderColor=\'#00ff00\';"  

either saving the id to a var and then applying the style to the var
   // var aInput=document.getElementById(n);
   // aInput.style.borderColor='#00ff00'

or applying to the element works
 // document.getElementById(n).style.borderColor='#00fff0'
  
 the element must first be retrieved (the page must know the object), then the style can be applied   
   
    */
function highlight_img(n,x)
{
if (document.getElementById) {
  if (x==1)

document.getElementById(n).style.background='#7ab2e2'
  //    #2B497B
//#66CFF2;
else 
     document.getElementById(n).style.background='#0000ff;'
     
}
}

