Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Wish to make text effect continuous

Status
Not open for further replies.

waydown

Programmer
Apr 27, 2009
49
0
0
GB
Hi,
I found the following code on a web site. It displays text as if it were being typed but it only does it once. I have been trying to use various functions to make the effect continuous, i.e. make the header appear as typing text, clear the text, again make the header appear as typing text, clear the text, and so on. I wish this to continue for as long as the web page is open. But I just can't get it to work. I wonder if anyone has any suggestions? I would be very grateful for all help.
Code:
<h2 id="fly">Header</h2>

<script type="text/javascript">

//Use "$" for linebreak
//By default, set to just grab the text from element with ID="fly"
message = document.getElementById("fly").innerHTML; // $ = taking a new line
distance = 50; // pixel(s)
speed = 200; // milliseconds

        var txt="",
	num=0,
	num4=0,
	flyofle="",
	flyofwi="",
	flyofto="",
	fly=document.getElementById("fly");


function stfly() 
{ for(i=0;i != message.length;i++) 
  { if(message.charAt(i) != "$")
       txt += "<span style='position:relative;visibility:hidden;' id='n"+i+"'>"+message.charAt(i)+"<\/span>";
    else txt += "<br>";
  }
  fly.innerHTML = txt;
  txt = "";
  flyofle = fly.offsetLeft;
  flyofwi = fly.offsetWidth;
  flyofto = fly.offsetTop;
  fly2b();
}

function fly2b() 
{ if(num4 != message.length) 
  { if(message.charAt(num4) != "$") 
    { var then = document.getElementById("n" + num4);
      then.style.left = flyofle - then.offsetLeft + flyofwi / 2;
      then.style.top = flyofto - then.offsetTop + distance;
      fly3(then.id, parseInt(then.style.left), parseInt(then.style.left) / 5, parseInt(then.style.top), parseInt(then.style.top) / 5);
    }
    num4++;
    setTimeout("fly2b()", speed);
  }
}

function fly3(target,lef2,num2,top2,num3) 
{ if((Math.floor(top2) != 0 && Math.floor(top2) != -1) || (Math.floor(lef2) != 0 && Math.floor(lef2) != -1)) 
  { if(lef2 >= 0)	lef2 -= num2;
    else lef2 += num2 * -1;
    if(Math.floor(lef2) != -1) 
    { document.getElementById(target).style.visibility = "visible";
      document.getElementById(target).style.left = Math.floor(lef2);
    } 
    else 
    { document.getElementById(target).style.visibility = "visible";
      document.getElementById(target).style.left = Math.floor(lef2 + 1);
    }
    if(lef2 >= 0) top2 -= num3
    else top2 += num3 * -1;
    if(Math.floor(top2) != -1)
        document.getElementById(target).style.top = Math.floor(top2);
    else
        document.getElementById(target).style.top = Math.floor(top2 + 1);
    setTimeout("fly3('"+target+"',"+lef2+","+num2+","+top2+","+num3+")",50)
  }
}
stfly()

</script>
[code]
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top