Creare una scritta con le parole che cadono dall'alto
Con questo script è possibile inserire una scritta,che si forma con la caduta dall'alto delle parole.
Per prima cosa inseriamo questo codice all'interno deltag head:
<script LANGUAGE="JavaScript" FPTYPE="dynamicanimation8"><!-- dynamicanimAttr = "dynamicanimation8" animateElements = new Array() currentElement = 0 speed = 0 stepsZoom = 8 stepsWord = 8 stepsFly = 12 stepsSpiral = 16 steps = stepsZoom step = 0 outString = "" function dynAnimation8() { var ms = navigator.appVersion.indexOf("MSIE") ie4 = (ms>0) && (parseInt(navigator.appVersion.substring(ms+5, ms+6)) >= 4) if(!ie4) {if((navigator.appName == "Netscape") && (parseInt(navigator.appVersion.substring(0, 1)) >= 4)){ for (index=document.layers.length-1; index >= 0; index--) {layer=document.layers[index]if (layer.left==10000) layer.left=0 }}return } for (index=document.all.length-1; index >= document.body.sourceIndex; index--) {el = document.all[index]animation = el.getAttribute(dynamicanimAttr, false)if(null != animation){ if(animation == "dropWord" || animation == "flyTopRightWord" || animation == "flyBottomRightWord") { ih = el.innerHTML outString = "" i1 = 0 iend = ih.length while(true) {i2 = startWord(ih, i1)if(i2 == -1) i2 = iendoutWord(ih, i1, i2, false, "")if(i2 == iend) breaki1 = i2i2 = endWord(ih, i1)if(i2 == -1) i2 = iendoutWord(ih, i1, i2, true, animation)if(i2 == iend) breaki1 = i2 } document.all[index].innerHTML = outString document.all[index].style.posLeft = 0 document.all[index].setAttribute(dynamicanimAttr, null) } if(animation == "zoomIn" || animation == "zoomOut") { ih = el.innerHTML outString = "<SPAN " + dynamicanimAttr + "="" + animation + "" style="position: relative; left: 10000;">" outString += ih outString += "</SPAN>" document.all[index].innerHTML = outString document.all[index].style.posLeft = 0 document.all[index].setAttribute(dynamicanimAttr, null) }} } i = 0 for (index=document.body.sourceIndex; index < document.all.length; index++) {el = document.all[index]animation = el.getAttribute(dynamicanimAttr, false)if (null != animation){ if(animation == "flyLeft") { el.style.posLeft = 10000-offsetLeft(el)-el.offsetWidth el.style.posTop = 0 } else if(animation == "flyRight") { el.style.posLeft = 10000-offsetLeft(el)+document.body.offsetWidth el.style.posTop = 0 } else if(animation == "flyTop" || animation == "dropWord") { el.style.posLeft = 0 el.style.posTop = document.body.scrollTop-offsetTop(el)-el.offsetHeight } else if(animation == "flyBottom") { el.style.posLeft = 0 el.style.posTop = document.body.scrollTop-offsetTop(el)+document.body.offsetHeight } else if(animation == "flyTopLeft") { el.style.posLeft = 10000-offsetLeft(el)-el.offsetWidth el.style.posTop = document.body.scrollTop-offsetTop(el)-el.offsetHeight } else if(animation == "flyTopRight" || animation == "flyTopRightWord") { el.style.posLeft = 10000-offsetLeft(el)+document.body.offsetWidth el.style.posTop = document.body.scrollTop-offsetTop(el)-el.offsetHeight } else if(animation == "flyBottomLeft") { el.style.posLeft = 10000-offsetLeft(el)-el.offsetWidth el.style.posTop = document.body.scrollTop-offsetTop(el)+document.body.offsetHeight } else if(animation == "flyBottomRight" || animation == "flyBottomRightWord") { el.style.posLeft = 10000-offsetLeft(el)+document.body.offsetWidth el.style.posTop = document.body.scrollTop-offsetTop(el)+document.body.offsetHeight } else if(animation == "spiral") { el.style.posLeft = 10000-offsetLeft(el)-el.offsetWidth el.style.posTop = document.body.scrollTop-offsetTop(el)-el.offsetHeight } else if(animation == "zoomIn") { el.style.posLeft = 10000 el.style.posTop = 0 } else if(animation == "zoomOut") { el.style.posLeft = 10000 el.style.posTop = 0 } else { el.style.posLeft = 10000-offsetLeft(el)-el.offsetWidth el.style.posTop = 0 } el.initLeft = el.style.posLeft el.initTop = el.style.posTop animateElements[i++] = el} } window.setTimeout("animate();" , speed) } function offsetLeft(el) { x = el.offsetLeft for (e = el.offsetParent; e; e = e.offsetParent)x += e.offsetLeft; return x } function offsetTop(el) { y = el.offsetTop for (e = el.offsetParent; e; e = e.offsetParent)y += e.offsetTop; return y } function startWord(ih, i) { for(tag = false; i < ih.length; i++) {c = ih.charAt(i)if(c == '<') tag = trueif(!tag) return iif(c == '>') tag = false } return -1 } function endWord(ih, i) { nonSpace = false space = false while(i < ih.length) {c = ih.charAt(i)if(c != ' ') nonSpace = trueif(nonSpace && c == ' ') space = trueif(c == '<') return iif(space && c != ' ') return ii++ } return -1 } function outWord(ih, i1, i2, dyn, anim) { if(dyn)outString += "<SPAN " + dynamicanimAttr + "="" + anim + "" style="position: relative; left: 10000;">" outString += ih.substring(i1, i2) if(dyn)outString += "</SPAN>" } function animate() { el = animateElements[currentElement] animation = el.getAttribute(dynamicanimAttr, false) step++ if(animation == "spiral") {steps = stepsSpiralv = step/stepsrf = 1.0 - vt = v * 2.0*Math.PIrx = Math.max(Math.abs(el.initLeft), 200)ry = Math.max(Math.abs(el.initTop), 200)el.style.posLeft = Math.ceil(-rf*Math.cos(t)*rx)el.style.posTop = Math.ceil(-rf*Math.sin(t)*ry) } else if(animation == "zoomIn") {steps = stepsZoomel.style.fontSize = Math.ceil(50+50*step/steps) + "%"el.style.posLeft = 0 } else if(animation == "zoomOut") {steps = stepsZoomel.style.fontSize = Math.ceil(100+200*(steps-step)/steps) + "%"el.style.posLeft = 0 } else {steps = stepsFlyif(animation == "dropWord" || animation == "flyTopRightWord" || animation == "flyBottomRightWord") steps = stepsWorddl = el.initLeft / stepsdt = el.initTop / stepsel.style.posLeft = el.style.posLeft - dlel.style.posTop = el.style.posTop - dt } if (step >= steps) {el.style.posLeft = 0el.style.posTop = 0currentElement++step = 0 } if(currentElement < animateElements.length)window.setTimeout("animate();" , speed) }//--></script>
Adesso inseriamo questo codice all'interno del tagbody, nel punto in cui vogliamo che compaiala scritta:
<p dynamicanimation8="dropWord"style="position: relative !important; left: 10000 !important"><big><big>Thanks fordropping by! Please visit us again soon.</big></big></p>
In ultimo, inseriamo l'attributoonload="dynAnimation8()" al tagbody, come nell'esempio:
<body onload="dynAnimation8()">