- {tutorialcode}
TCJ .[jimdo.com]
STEP 1: Copy and paste the code below so that it sits between the <head> and </head> tags at the top of your web-page:
<script type="text/javascript">
// <![CDATA[
var speed=40; // speed of animation, lower is faster
var interval=1; // seconds between entry of each letter
var direction="right"; // set to "left" for text to appear from left
/***************************\
* Right Write Text Effect *
* (c)2003-6 mf2fm web-design*
* http://www.mf2fm.com/rv *
* DON'T EDIT BELOW THIS BOX *
\***************************/
var rwtxt, swide, shigh;
var rwlft=new Array();
window.onload=function() { if (document.getElementById) {
set_width();
var rwli="";
var rwrit=document.getElementById("rightwrite");
rwrit.style.position="relative";
rwtxt=rwrit.firstChild.nodeValue;
while (rwrit.childNodes.length) rwrit.removeChild(rwrit.childNodes[0]);
for (var i=0; i<rwtxt.length; i++) {
rwli=document.createElement("span");
rwli.setAttribute("id", "rwr"+i);
rwli.style.position="relative";
rwli.style.visibility="hidden";
rwli.appendChild(document.createTextNode(rwtxt.charAt(i)));
rwrit.appendChild(rwli);
}
for (var i=0; i<rwtxt.length; i++) if (rwtxt.charAt(i)!=" ") {
rwli=document.getElementById("rwr"+i);
rwlft[i]=(direction=="right")?swide-getPageLeft(rwli):-getPageLeft(rwli);
setTimeout("fly_me("+i+")", 1000*interval*((direction=="right")?i:rwtxt.length-i));
}
}}
function getPageLeft(el) {
var x=0;
do { x+=el.offsetLeft }
while ((el=el.offsetParent)!=null) ;
return x;
}
function set_width() {
if (typeof(self.innerWidth)=="number") {
swide=self.innerWidth;
shigh=self.innerHeight;
}
else if (document.documentElement && document.documentElement.clientWidth) {
swide=document.documentElement.clientWidth;
shigh=document.documentElement.clientHeight;
}
else if (document.body.clientWidth) {
swide=document.body.clientWidth;
shigh=document.body.clientHeight;
}
}
function fly_me(let) {
var rwme=document.getElementById("rwr"+let);
if (rwme.style.visibility=="hidden") rwme.style.visibility="visible";
if (Math.abs(rwlft[let])>0.5) {
rwme.style.left=Math.floor(rwlft[let])+"px";
rwlft[let]+=(direction=="left")?1:-1;
rwlft[let]*=0.98;
setTimeout("fly_me("+let+")", speed);
}
else rwme.style.left="0px";
}
// ]]>
</script>
STEP 2: Place a <div> element with ' id="rightwrite" ' on your web-page containing the text you wish to be animated. For example:
<div id="rightwrite">RIGHT WRITE TEXT</div>
Don't include anything other than text between the <div> tags.
Best view in firefox.
Excel-Formeln etc. *
zum Forum *
Facebook
* in Bearbeitung
Topbar
Back to Top
Lorem Ipsum
Image2Data-Convertor
JPEGmini
Image2PNG
JavaScript Compressor
JavaScript Beautifier
HTML Table Style Generator
http://goqr.me/de/
Close Bar [X]
∂ιє νєяgαηgєηнєιт нαт мι¢н zυ ∂єя ρєяѕση gємα¢нт ∂ιє ι¢н нєυтє вιη.