location.hashで遊んでみる

location.hashで遊んでみました。

https://dl.dropbox.com/u/7647582/tools/junk/animate_location.html
※ブラクラ注意
環境によってはブラウザが落ちるかもしれません。
自己責任でどうぞ。
アドレスバーがぐるぐると変化します。
止めたいときはタブ(Window)ごと閉じてください。
消えるまで時間かかる時もあります。

<html>
<script>
(function(){
    var i = 0;
    // この文字列がループして表示されます
    var list = "_,.-+=;#*A*#;=+-.,_  _,.-+=;#*A*#;=+-.,_ ";

    // location.hashを書き換える関数
    var rewrite = function(){
        i = (i + 1) % list.length;
        location.hash = list.slice(i,list.length) + list.slice(0,i);
    }

    // setInterbal で5ms毎に呼び出す
    setInterval(rewrite,5);
})();
</script>
</html>

やっていることは単純で、
location.hashをsetIntervalで定期的に書き換えてるだけです。
location.hashに値を代入すると、
URLの後ろに#で始まる文字列を付与できます。
ちなみにlocation.hrefを書き換えるとアドレスごと書き換えが可能ですが、
書き換えたページに飛んでしまうので、今回のような
アニメーションしたい時は全然役に立ちません。

書き換え周期をゆっくりにするとブラクラ度が減ってより安全になります。

本来はページのナビゲーションなどで利用されるLocation.hashですが
アドレスバーを書き換えられるという面で別の使い道がありそうですね。

Thu, 24 Jan 2013 23:34:41 +0000   |   Category:Javascript

関連記事

About Me

kimihiro-n

Androidアプリを中心にいろいろアプリ作ってます。
T N G

Products

放課後アプリ部
放課後アプリ部
個人アプリ開発者のための集客プラットフォーム作りました。 AndroidやiOSアプリのダウンロード数増加を無料で手伝います!

最速のJSON可視化・解析ツール
JSONを使った開発をスムーズにするためのツールです。 特定の値までのパスを簡単に取れます。
過去に作ったiOSアプリ
明日から本気出すタスク管理 for iOS
過去に作ったAndroidアプリ
明日から本気出すタスク管理 for Android Nagareboshi taplight
Others..

Search Articles