JavaScript Tutorial/Animation/Text

Материал из Web эксперт
Перейти к: навигация, поиск

Animation by changing both pixelTop and pixelLeft (IE)

<html>
<head>
<title>A Simple Page</title>
<script language="JavaScript">
<!--
function moveTxt()
{
    if (ani1.style.pixelTop < 500)
    {
        ani1.style.pixelTop += 2;
        ani1.style.pixelLeft += 2;
        setTimeout("moveTxt()", 50);
    }
}
//  -->
</script>
</head>
<body onLoad="moveTxt()">
<div id="ani1" style="position:absolute;left:10;top:10">
Text ... on the go!
</div>
</body>
</html>


Text animation

<html>
<head>
<style>
div { position:relative;
}
</style>
<title>Animating Text</title>
<SCRIPT LANGUAGE="JavaScript" type = "text/javascript">
var pos1 = 0;
function f() {
    pos1 += 5;
    if (pos1 > 640)
       pos1 = 0;
    document.getElementById("movetext").style.left = pos1;
    window.setTimeout("f();",300);
}
</SCRIPT>
</head>
<body onLoad="f();">
<div id="movetext">
<b>inside a div</b>
</div>
</body>
</html>