みかづきブログ その3

3ヶ月つづけてみました。

昨日のブログを振り返ろう。

昨日の記事 は大抵の環境で意味がわからなかったと思うのですが、ごく一部の環境ではURLバーにメッセージが流れていました。
(PC版Google ChromeFireFoxSafari にて確認)

原理的にはHistoryAPIをつかっています。

(function start(win, ms, opt_length) {
    // 該当記事のみを見ているかを雑に確認
    if (!/2014\/03\/11/.test(location.href)) {
        return;
    }

    var txt = "今回のブログはURLですべてを語ってみます。"
    var count   = 0,
        initTxt = "#__",
        length  = opt_length || 12,
        i       = length;

    // history APIがつかえるかを雑に確認
    if (!win.history) {
        return;
    } else if (!history.replaceState) {
        return;
    }

    while (i--) {
        initTxt += "_";
    }

    // 履歴に残さないようにreplaceStateを使用
    history.replaceState({}, null, initTxt);

    var timer = setInterval(function () {
        var space     = initTxt,
            scrollTxt = space + txt + space,
            txtLength = scrollTxt.length - space.length;

        count = ++count % txtLength;
        scrollTxt = scrollTxt.substr(count, length);
        history.replaceState({}, null, "#_" + scrollTxt + "_");
    }, ms);
})(this, 1500, 12);

こんな感じです。
locationオブジェクトの際 も思いましたが、replaceメソッドは便利ですね。

今回は以上です。