Форум

Seregapop · #1 (**permalink**) 20.02.2013, 18:39

Здравствуйте!
Прошу помочь с завершением скрипта, нужно выполнить одно дурацкое задание! Есть буква, она бегает по диагонали. Но нужно, чтобы она половину пути увеличивалась, а затем уменьшалась. Как это можно реализовать? Дали подсказку, что нужно использовать "document.write", но не понимаю, куда и что прописывать - не силён в этом.
Сам скрипт:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Анимация: движение картинки</title>
<style>
Div {font-size:14;font-weight:bold; }
</style>
<script language="javascript">
var dx, dy, timer;
dx=3;
dy=14;
function moveImage(){

div11.style.pixelLeft += dx;
div11.style.pixelTop += dx;

if(div11.style.pixelLeft + div11.style.pixelWidth >= document.body.clientWidth)
if(div11.style.pixelTop + div11.style.pixelWidth >= document.body.clientWidth)
{
dx = -dx;
dy = -dy;
}
if(div11.style.pixelLeft <= 0)
if(div11.style.pixelTop <= 0)
{
dx = -dx;
dy = -dy;
}
}
function setupAnimation(){
timer=window.setInterval("moveImage()",6)
}

</script>
</head>
<body onLoad="setupAnimation();">

<div ID="div11" style="top:100; left:150; position:absolute; z-index:1">J</div>
</body>
</html>

рони · #2 (**permalink**) 20.02.2013, 22:11

Seregapop,

<html>

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
        <title>Анимация: движение картинки</title>
        <style>
            Div {
                font-weight:bold;
            }
        </style>
        <script language="javascript">
            function get(a) {
                var c = document,
                    d = c.body,
                    e = c.documentElement,
                    f = "client" + a;
                a = "scroll" + a;
                return c.compatMode === "CSS1Compat" ? Math.max(e[f], e[a]) : Math.max(d[f], d[a])
            }
            var div, h, w, width, height, L = 150,
                T = 100,
                f = 40,
                df = 3;
            var dx, dy, timer;
            dx = 3;
            dy = 14;

            function moveDn() {
                h = div.offsetHeight;
                w = div.offsetWidth;
                L += dy;
                T += dx;
                if (L < width / 2) f += df;
                else f -= df;
                if (f < 0) f = 1
                div.style.fontSize = f + "px"
                div.style.left = L + "px";
                div.style.top = T + "px";
                if (h + T < height && w + L < width - 15) window.setTimeout(moveDn, 100);
                else window.setTimeout(moveUp, 50);
            }

            function moveUp() {
                h = div.offsetHeight;
                w = div.offsetWidth;
                L -= dy;
                T -= dx;
                if (L > width / 2) f += df;
                else f -= df;
                if (f < 0) f = 1
                div.style.fontSize = f + "px"
                div.style.left = L + "px";
                div.style.top = T + "px";
                if (T < 0 || L < 0) window.setTimeout(moveDn, 50);
                else window.setTimeout(moveUp, 100);
            }

            function init() {
                div = document.getElementById('div11');

                width = get("Width");
                height = get("Height")
                moveDn();
            }
        </script>
    </head>

    <body onLoad="init()">
        <div ID="div11" style="top:100px; left:150px; position:absolute; z-index:1">J</div>
    </body>

</html>

Форум

Справочник

Discord чат

Курсы javascript