javascriptのsetTimeout

setTimeoutで定期的にcssを変更する例です。
クリックするとスタートします。
もう一度クリックするとストップします。

sample

ソース。

<table id="wordTestTwitch001" style="border-collapse: collapse; padding: 0pt; width: 112px; height: 112px; text-align: center; vertical-align: middle; background-color: rgb(255, 255, 255); color: rgb(127, 127, 127); border: 1px solid rgb(24, 24, 24); margin: 0pt auto 14px auto; font-size: 14px; font-family: monospace;"><tbody><tr><td><div>sample</div></td></tr></tbody></table><div style="font-family: monospace; font-size: 14px; margin: 0pt 0pt 0pt 14px; padding: 0pt;" id="wordTestTwitch001Result"></div><script type="text/javascript">
//<![CDATA[<!--
try{(function(){
    var tableElem = document.getElementById("wordTestTwitch001"),
    resultElem = document.getElementById("wordTestTwitch001Result"),
    mainTop = (function(){
        return $("#main").offset().top + parseInt($("#main").css("padding-top"), 10);
    })(),
    mainLeft = (function(){
        return $("#main").offset().left + parseInt($("#main").css("padding-left"), 10);
    })(),
    tableTop = $(tableElem).offset().top - mainTop,
    tableLeft = $(tableElem).offset().left - mainLeft,
    tableBottom = tableTop + $(tableElem).outerHeight(),
    tableRight = tableLeft + $(tableElem).outerWidth(),
    orderCount = 0,
    randFunc = function(division){
        return ((Math.random() * 2) - 1) * division;
    },
    processCount = 0,
    checkStop = function(){
        processCount--;
        if (processCount <= 0)
        {
            $(tableElem).unbind("click");
            $(tableElem).css("cursor", "default");
        }
    },
    loopCount = 600,
    startTime = new Date().getTime();
    $("#wordTestTwitch001, #wordTestTwitch001 *").each(function(){
        if (!$(this).html().match(/</))
        {
            $(this).html($(this).text().replace(/(.)/g, function(){
                return "<" + "span class='wordTestTwitch001Class'>" + arguments[1] + "<" + "/span>";
            }));
        }
    }).find(".wordTestTwitch001Class").each(function(){
        $(this)
            .css("top", $(this).offset().top - mainTop)
            .css("left", $(this).offset().left - mainLeft);
    }).each(function(){
        $(this).css("position", "absolute");
        var cnt = 0,
        elem = $(this),
        top = parseFloat(elem.css("top")),
        left = parseFloat(elem.css("left")),
        fontSize = parseFloat(elem.css("font-size")),
        red = 127.5,
        green = 127.5,
        blue = 127.5,
        stopFlag = false,
        wordTestTwitch001FuncStop = function(){
            elem.remove();
            checkStop();
            if (processCount <= 0)
            {
                $(resultElem).append("ストップ<" + "br/>");
            }
        },
        wordTestTwitch001FuncTimeOver = function(){
            $(resultElem).append("時間切れ: " + elem.text() + "<" + "br/>");
            elem.remove();
            checkStop();
        },
        wordTestTwitch001FuncArrival = function(){
            ++orderCount;
            $(resultElem).append(
                (String(orderCount).length == 1 ? "&nbsp;" : "") + orderCount + "位: " + elem.text()
                    + " (font-size:" + (String(fontSize).length == 1 ? "&nbsp;" : "") + Math.round(fontSize) + "px"
                    + " color:<" + "span style='color: rgb("
                    + Math.round(red) + "," + Math.round(green) + "," + Math.round(blue) + ");"
                    + " font-family: monospace; font-size: 14px;'>■<" + "/span>"
                    + " time:" + (parseInt(((new Date().getTime()) - startTime) / 100, 10) / 10) + "秒"
                    + ")<" + "br/>"
            );
            elem.remove();
            checkStop();
        },
        wordTestTwitch001FuncExecute = function(){
            var topTmp, leftTmp, accel = Math.pow(8 * cnt / loopCount, 2) / 8;
            if (stopFlag)
            {
                wordTestTwitch001FuncStop();
                return;
            }
            if (++cnt > loopCount)
            {
                wordTestTwitch001FuncTimeOver();
                return;
            }
            top += randFunc(0.1 + accel);
            left += randFunc(0.1 + accel);
            fontSize += randFunc(0.1 + accel);
            red += randFunc(10 + accel);
            green += randFunc(10 + accel);
            blue += randFunc(10 + accel);
            fontSize = Math.max(1, Math.min(100, fontSize));
            red = Math.max(0, Math.min(255, red));
            green = Math.max(0, Math.min(255, green));
            blue = Math.max(0, Math.min(255, blue));
            elem.css("font-size", Math.round(fontSize) + "px")
                .css("color", "rgb(" + Math.round(red) + "," + Math.round(green) + "," + Math.round(blue) + ")");
            topTmp = Math.max(tableTop, Math.min(tableBottom - elem.outerHeight(), top));
            leftTmp = Math.max(tableLeft, Math.min(tableRight - elem.outerWidth(), left));
            if (top != topTmp || left != leftTmp)
            {
                wordTestTwitch001FuncArrival();
                return;
            }
            elem.css("top", Math.round(top) + "px").css("left", Math.round(left) + "px");
            setTimeout(wordTestTwitch001FuncExecute, 100);
        },
        startFunc = function(){
            $(tableElem).unbind("click", startFunc);
            setTimeout(wordTestTwitch001FuncExecute, 0);
            $(tableElem).click(stopFunc);
        },
        stopFunc = function(){
            $(tableElem).unbind("click", stopFunc);
            stopFlag = true;
        };
        $(tableElem).click(startFunc);
        processCount++;
    });
    $(tableElem).css("cursor", "pointer");
})();}catch(e){window.document.write("<"+"pre>Error: " + e + "<"+"/pre>");}
//-->]]>
</script>

説明。
グローバルオブジェクト(関数)として下記を使用しています。

$, Date, Math, String, arguments, document, parseFloat, parseInt, setTimeout, window

これらはwindow以外window.を省略しています。(window.$, window.Date など)

setTimeoutはwordTestTwitch001FuncExecuteを呼び出すのに利用しています。
ソースの最後の方の、

setTimeout(wordTestTwitch001FuncExecute, 100);
...
        $(tableElem).click(startFunc);

の、

$(tableElem).click(startFunc);

でクリック時に、

setTimeout(wordTestTwitch001FuncExecute, 0);

を読んでいます。(すぐに実行する。)
wordTestTwitch001FuncExecuteの中で自身を再実行しています。

setTimeout(wordTestTwitch001FuncExecute, 100);

100ミリ秒(0.1秒)後に実行する。
テストする場合"#main"を"body"などに変更して下さい。
jqueryは1.6.4です。
このサンプルが重いのはsetTimeoutのせいではなく動かす中身が重いためです。
アニメーションさせるにはanimateがお勧めです。