
var delay = 1500; //set delay between message change (in miliseconds)
var maxsteps=40; // number of steps to take to change from start color to endcolor
var stepdelay=40; // time in miliseconds of a single step
//**Note: maxsteps*stepdelay will be total time in miliseconds of fading effect
var startcolor= new Array(255,255,255); // start color (red, green, blue)
// var endcolor=new Array(121,158,215); // end color (red, green, blue)
// var endcolor=new Array(0,143,213); // end color (red, green, blue)
//var endcolor=new Array(100,100,100); // end color (red, green, blue). User MS-Paint and select Colors | Edit Colors... | Define Custom Colors
var endcolor=new Array(0,0,0);

var fcontent=new Array();

// In the following begintag variable, remember to specify the same width and height for the variables fwidth and fheight below this block:
// begintag='<div style="position:relative; visibility:show; width:500px; height:60px; left:0px; top:0px; border-style: none; border-color:#FFFFFF; background-image:url(\'images/sloganBackground.jpg\')">'; 
begintag='<div style="position:absolute; visibility:show; width:440px; height:60px; left:95px; top:140px; border-style: none; border-color:#ffffff;">'; 

fcontent[0]="<p class='slogan_text' align='center'><br>Welcome to Tran Dental Lab</p>";
fcontent[1]="<p class='slogan_text' align='center'><br>Committed to excellent services</p>";
fcontent[2]="<p class='slogan_text' align='center'><br>We take work quality personally</p>";
fcontent[3]="<p class='slogan_text' align='center'><br>We take clients one at a time</p>";
fcontent[4]="<p class='slogan_text' align='center'><br>Your satisfaction is our success</p>";
fcontent[5]="<p class='slogan_text' align='center'><br>Call us now (215) 342-6570</p>";
closetag='</div>';

var fwidth='440px'; //set scroller width - should be the same as specified in the begintag var
var fheight='60px'; //set scroller height - should be the same as specified in the begintag var
var fadelinks=1;  //should links inside scroller content also fade like text? 0 for no, 1 for yes.

// No need to edit below this line
var ie4=document.all&&!document.getElementById;
var DOM2=document.getElementById;
var faderdelay=0;
var index=0;

//function to change content
function changecontent(){
  if (index>=fcontent.length)
    index=0
  if (DOM2){
    document.getElementById("fscroller").style.color="rgb("+startcolor[0]+", "+startcolor[1]+", "+startcolor[2]+")"
    document.getElementById("fscroller").innerHTML=begintag+fcontent[index]+closetag
    if (fadelinks)
      linkcolorchange(1);
    colorfade(1, 15);
  }
  else if (ie4)
    document.all.fscroller.innerHTML=begintag+fcontent[index]+closetag;
  index++
}

function linkcolorchange(step){
  var obj=document.getElementById("fscroller").getElementsByTagName("A");
  if (obj.length>0){
    for (i=0;i<obj.length;i++)
      obj[i].style.color=getstepcolor(step);
  }
}

var fadecounter;
function colorfade(step) {
  if(step<=maxsteps) {	
    document.getElementById("fscroller").style.color=getstepcolor(step);
    if (fadelinks)
      linkcolorchange(step);
    step++;
    fadecounter=setTimeout("colorfade("+step+")",stepdelay);
  }else{
    clearTimeout(fadecounter);
    document.getElementById("fscroller").style.color="rgb("+endcolor[0]+", "+endcolor[1]+", "+endcolor[2]+")";
    setTimeout("changecontent()", delay);
	
  }   
}

/*Rafael Raposo's new function*/
function getstepcolor(step) {
  var diff
  var newcolor=new Array(3);
  for(var i=0;i<3;i++) {
    diff = (startcolor[i]-endcolor[i]);
    if(diff > 0) {
      newcolor[i] = startcolor[i]-(Math.round((diff/maxsteps))*step);
    } else {
      newcolor[i] = startcolor[i]+(Math.round((Math.abs(diff)/maxsteps))*step);
    }
  }
  return ("rgb(" + newcolor[0] + ", " + newcolor[1] + ", " + newcolor[2] + ")");
}

if (ie4||DOM2)
  //document.write('<div id="fscroller" style="border:1px solid black;width:'+fwidth+';height:'+fheight+'"></div>');
  document.write('<div id="fscroller" style="border-style: none; width:'+fwidth+';height:'+fheight+'"></div>');

if (window.addEventListener)
window.addEventListener("load", changecontent, false)
else if (window.attachEvent)
window.attachEvent("onload", changecontent)
else if (document.getElementById)
window.onload=changecontent