Flipping Message in Text Box

This script allows your messages or sentences rotate in the text box. You can pre-write a sentence or message within the script, and set the rotation time for each message display.

The Flipping Message will effectively lead to the attention of visitors in order to convey your message to them.

Script Demo:

Demo

JavaScript Code:

Insert this code into <head> tags

<script language="javascript">

<!-- Begin
var CurrentMsg = 'Hello?  Welcome to The JavaScript Source!!';
function update(msg) {
var pad_str="";
n = msg.length;
if(n<72) {
pad = (73-n)/2;
for(var i=0; i<pad; i++) {
pad_str+=" ";
   }
}
CurrentMsg = pad_str + msg;
document.getElementById("field").value = CurrentMsg;
clearTimeout(timer);
timer = setTimeout("idleMsg()",2500);
}
function MakeArray(n) {
this.length=n;
for(var i = 1; i<= n; i++) {
this[i] = "";
}
return(this);
}
var index = 1;
var notice_num = 9;
var notices = new MakeArray(notice_num);
notices[1] = "Welcome to The JavaScript Source!";
notices[2] = "Hey, thanks for coming!  I am glad you visited!";
notices[3] = "Each message can be adjusted either in speed, or content.";
notices[4] = "The length of the message box can also be personalized to fit your needs.";
notices[5] = "More scripts to this effect can be found throughout this site.";
notices[6] = "Don't forget to get your own home page to show off all your scripts!";
notices[7] = "I hope that these scripts help you to improve your web site!!";
notices[8] = "Be sure to sign my guestbook and complete my survey before you leave!";
var timer = setTimeout('idleMsg()',1500);
function nochange() {
document.getElementById("field").value = CurrentMsg;
}
function idleMsg() {
update(notices[index++]);
if(index>notice_num) {
index=1;
   }
}
// End -->
</script>

Insert this code into <body> tags

<FORM name="messages" onSubmit="return false">
<input type="text" id="field" name="field" size=73 value=" Hello?  Welcome to R2W!!" onFocus="self.status='This is a JavaScript information data field'; return true" onChange="nochange()">
</FORM>

Instruction:

Change the following text:

var notice_num = 9; - Number of message.
Hello? Welcome to R2W!! - First message to displayed.
notices[x] = "Message"; - Add new message.

Webmaster » Web Programming » JavaScript » Message » You are here

Related Links:

Home | Sitemap | Bookmark This Page

Sponsored Links

Recommended Links