Buttons Rotate and Grow

[Total: 0    Average: 0/5]

This will dynamically alter the look and feel of form text buttons.

Body Code:

<SCRIPT LANGUAGE="JavaScript">
<!--
var timerID = null
var timerRunning = false
var charNo = 0
var charMax = 0
var lineNo = 0
var lineMax = 3
var lineArr = new Array(lineMax)
var urlArr = new Array(lineMax)

lineArr[1] = "Js-Examples"                  
urlArr[1] = "http://www.js-examples.com/"
lineArr[2] = "Yahoo"                  
urlArr[2] = "http://www.yahoo.com/"
lineArr[3] = "AltaVista"                  
urlArr[3] = "http://www.altavista.com"


var lineText = lineArr[1]
function StartShow() {
	StopShow()
	ShowLine()
	timerRunning = true
}
function FillSpaces() {
	for (var i = 1; i <= lineWidth; i++) {
		spaces += " "
	}
}
function StopShow() {
	if (timerRunning) {
		clearTimeout(timerID)
		timerRunning = false
	}
}
function ShowLine() {
	if (charNo == 0) { // Next line
		if (lineNo < lineMax) 	{
			lineNo++
		}
		else {
			lineNo = 1
		}
		lineText = lineArr[lineNo]
		charMax = lineText.length
	}
	if (charNo <= charMax) { // Next char
		document.formDisplay.buttonFace.value = lineText.substring(0, charNo)
		charNo++
		timerID = setTimeout("ShowLine()", 100)
	}
	else {
		charNo = 0
		timerID = setTimeout("ShowLine()", 3000)
	}
}
function GotoUrl(url)
{
	top.location.href = url
}
// end hide -->
</SCRIPT>

<!-- To BODY -->
<SCRIPT LANGUAGE="JavaScript">
<!--
document.write("<FORM NAME="formDisplay">");
document.write("<INPUT TYPE="BUTTON" NAME="buttonFace" VALUE="&{lineText}" SIZE="18" onClick="GotoUrl(urlArr[lineNo])">");
document.write("</FORM>");
StartShow();
//-->
</SCRIPT>

Times Viewed: 0

Leave a Reply

Your email address will not be published. Required fields are marked *