JavaScript - An open source scripting language, it allows the creation of dynamic web page content.  Home Web Programming JavaScript Bouncing Text

Bouncing Text


 
 
 
 
Click to start the script.

Put this code into your page:

<html>
<head>

<style>
.scroll
{
FONT: 10pt arial;
COLOR: black;
background-color: white;
border: medium none
}
</style>

<SCRIPT LANGUAGE=JAVASCRIPT>
// Declare all Local Variables Here
Size2 = 68; //distance of the move inside the text box
Pos2 = Size2;
Vel2 = 2;
Dir2 = 2;

Message2="WebDesignHelper.co.uk";
Size2-=Message2.length;

function Bouncer(){
Dir2==2 ? Pos2-=Vel2 : Pos2+=Vel2;
if (Pos2 < 1){
Dir2=1;
Pos2=1;
}
if (Pos2 > Size2){
Dir2=2;
Pos2=Size2;
}
Space2 = "";
for (count=1; count<Pos2; count++){
Space2+= " ";
}
document.PANEL2.Bar2.value = Space2 + Message2;
setTimeout( 'Bouncer();', 100);
}
</SCRIPT>
</HEAD>

<BODY BGCOLOR="#FFFFFF" ONLOAD="Bouncer()">

<br><br><br>
<center>
<form name="PANEL2">
<TABLE width="150" border="0" cellpadding="0" cellspacing="0" bgcolor=#F5F4E0>
<tr>
<td colspan=3><img src=images/spacer.gif height=10></td>
</tr>
<tr>
<td><img src=images/spacer.gif width=10></td>
<td><input type="text" name="Bar2" size="50" class=scroll onfocus="blur()"></td>
<td><img src=images/spacer.gif width=10></td>
</tr>
<tr>
<td colspan=3><img src=images/spacer.gif height=10></td>
</tr>
</table>
</form>
</center>

</body>
</html>



Author's URL: Rob Derby
JavaScript - An open source scripting language, it allows the creation of dynamic web page content. More JavaScript Tutorials: Featured Materials | Fresh Materials | More JavaScript Tutorials at LearnPHP.org

No comments yet...
Add comments to "Bouncing Text"

Captcha