Animierter Link-Button

Animierter Link-Button

In diesem animierten Button sind drei verschiedene Links versteckt, die nacheinander durch Klicken auf den Button erreicht werden können (kann beliebig erweitert werden)

Sourcecode:

<script type="text/javascript" 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] = "      BMW      "                  
urlArr[1] = "http://www.bmw.de"
lineArr[2] = " Netscape "                  
urlArr[2] = "http://www.netscape.com"
lineArr[3] = " Microsoft "                  
urlArr[3] = "http://www.microsoft.de"
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
}
</script>

</head>

<body>

<script type="text/javascript" language="JavaScript">
document.write("<center><form name=\"formDisplay\">");
document.write("<input type=\"BUTTON\" name=\"buttonFace\" 
 value=\"&{lineText}\" size=\"18\" onClick=\"GotoUrl(urlArr[lineNo])\">");
document.write("</form></center>");
StartShow();
</script>

</body>
Sponsoren und Investoren

Sponsoren und Investoren sind jederzeit herzlich willkommen!
Wenn Sie die Information(en) auf dieser Seite interessant fanden, freuen wir uns über eine kleine Spende. Empfehlen Sie uns bitte auch in Ihren Netzwerken (z. B. Twitter, Facebook oder Google+). Herzlichen Dank!

Nach oben Sitemap
Impressum & Kontakt