サイトマップ

JavaScriptコードスニペット:faviconをアラートにする

Webブラウザをコンソール化してシステムの管理情報を常に表示させておくということを考えました。ajax的な方法で定期的に新しい情報を取りにいけば、いかにもな監視コンソール風のものができそうです。ただ、常にその画面を眺めているわけにもいかないので、何かが起こったときにアラートを出す方法が必要です。

かといって、普通にalert()をつかってポップアップを出すと、他の画面で何か作業しているときに、そちらの画面に強制的に切り替えられてしまい、不愉快な思いをすることがあります。そこで、faviconを切り替えて点滅させるなどすれば、他のタブなりウインドウを見ていても気がつくんじゃないかと思いました。

調べてみると同じようなことを考える人は他にもいて1)、そちらの情報が役に立ちました。あちらでは、JavaScriptのタイマーを使って画像をブリンクさせていますが、普通にアニメーションgifで点滅表示をさせることができました。

  • 先にfavicon指定の要素<link href="..." rel="shortcut icon">があったら削除しておく。
  • 新しいlinkタグは属性をセットした後にdocumentにセットする。

というあたりがポイントです。

※IE6.0ではうまくいかないようです。

(function(){
  var nodes = document.getElementsByTagName('link');
  var n;
  for (var i = 0; i < nodes.length; i++) {
    n  =nodes.item(i);
    if(n.getAttribute('rel') == 'shortcut icon') {
      var p = n.parentNode;
      p.removeChild(n);
      break;
    }
  }
  n = document.createElement('link');
  n.setAttribute('href', 'http://shorindo.com/_media/research:caution.gif');
  n.setAttribute('rel','shortcut icon');
  p.appendChild(n);
})();

【サンプルの実行】クリックすると、このページのfaviconが注意標識の点滅に変わります。

関連コンテンツ

 
research/1309038188.txt · 最終更新: 2011/07/02 08:37 by Kazuyuki Matsuda
特に明示されていない限り、本サイトの内容は次のライセンスに従います:Copyright(C) 2011 Shorindo, Inc. All Rights Reserved
Powered by PHP Valid XHTML 1.0 Valid CSS Driven by DokuWiki