昔、HTMLソースの中に秘密のメッセージを埋め込むのが流行りました。例えば求人を入れていたり、問題を書いておくといった具合です。当たり前のことですが、開発者ツールを開くのは開発者くらいです。だからこそ良い宣伝になったのです。 そんな特徴を使って遊べるのがjdetectsです。開発者ツールを開いたタイミングでイベントを実行できます。

jdetectsの使い方

jdetectsのイベント設定です。

jdetects.create(function(status) {
	document.querySelector("#devtool-status").innerHTML = status;
});

開いていない状態です。

開いたタイミングでCSSのプロパティを変更しています。

jdetectsはGoogle Chromeだけでなく、Safariなどでもイベントが発火します。コンソールにメッセージを流しても良いですし、逆にどうしても解析されたくない場合には使われないための施策を考えてみても良いでしょう。

jdetectsはJavaScript製のオープンソース・ソフトウェア(MIT License)です。

JS Bin - Collaborative JavaScript Debugging zswang/jdetects: Detect if DevTools is open