これは凄いかも知れない…。 最近のCSSフレームワークは幅を12分割した上でデスクトップ、タブレット、スマートフォンに適応させるスタイルになっています。しかしこれでは緻密な画面設計を求められる日本の業務システムにはマッチしません。 日本の業務システムと言えばExcel方眼紙がデフォルトです（断定）。そのUIに慣れ親しんだ人のためのグリッドレイアウトフレームワークがjagridです。 jagridの使い方 こんにちは、Excel方眼紙！ うん、まさにExcel方眼紙です。 表はまさにお手の物。 セル3つ分、といった指定も簡単にできます（data-widthで指定）。 従来のWebコンポーネントと合わせることもできます。ちゃんと文字の頭が合っているのに注目。 こんな緻密な画面も簡単に設計できます。 Webデザインにおいてこれほど緻密な画面を設計しようと思うと、かなり苦労するはずです。しかしja

Googleマップをプログラマブルに組み込むのに良さそうです。 GoogleマップはAPIの多彩さ、機能の柔軟さもあって様々なサービスで使われています。位置情報や地図を扱おうと思ったら一番に考えるのではないでしょうか。 そんなGoogleマップをさらに手軽に使えるようにしてくれるライブラリがMaplace.jsです。機能は限られますが広範囲に利用できそうです。 まずは簡単なデモ。地図の表示を行います。コードとしてはたった数行です。 // JavaScript var maplace = new Maplace(); maplace.Load(); // or new Maplace().Load(); // HTML <div id="gmap"></div> その結果は次のようになります。 シンプルな地図表示。 次はドロップダウンやリストを使ったマーカーのデモ。マーカーは自動的に中央に表

これはインパクト大！が、多用は禁物なようです。 動きのあるWebサイトは目を引きます。Flashや画像を使ったアニメーションは多いですが、jQuery Lively LayoutはさらにWebサイト自体をアニメーションさせてしまうという凄いソフトウェアです。 何はともあれまずは動画を見てもらうのが良いと思います。 ということで凄さは分かってもらえたと思いますので使い方です。まずJavaScriptファイルを読み込みます。 <script type="text/javascript" src="/path/to/jquery.js"></script> <script type="text/javascript" src="/path/to/jquery.easing.js"></script> <script type="text/javascript" src="/path/to/jqu

DiagnostiCSSはJavaScript製のオープンソース・ソフトウェア（MIT License）です。 Webブラウザはよく出来ていて、Web標準に沿っていなくともそれっぽく表示してくれます。しかしそれに安穏としているとレガシーなブラウザなどで表示が失敗したり、意図した動作にならないことがあります。そこでDiagnostiCSSを使ってチェックしてみましょう。 MOONGIFTで実行しました。様々な枠が表示されました。 マウスオーバーで画面上部にメッセージが表示されます。例えばonclick指定の指摘です。 かなりダメなところは赤い枠になっています。 DiagnostiCSSでは問題のあるHTML要素について枠で囲むことで問題を把握しやすくしてくれます。主にインラインスタイルやイベント属性、無効なリンク、空または廃止予定の要素、必要な属性のない要素などがリストアップされます。 HT

MD5-Password-Cracker.jsはJavaScriptを使ってMD5のハッシュ値から元テキストを検索するソフトウェアです。 パスワードをハッシュ化して保存しておくのは基本と思われますが、その際によく使われるのがMD5ではないでしょうか。SHA-1/SHA-2のが良いと思うのですが、それをまざまざと知らしめてくれるのがMD5-Password-Cracker.jsです。 パスワードクラック開始！Web Workersが8つ使われています。 パスワードはheyaでした。1ワーカーあたり1秒間に約7万の解析が行われています。4文字のパスワードに対して23秒で解析されました。 網羅的に文字列を試しているので時間は要しますが、4文字程度のパスワードであればあっという間に解析されてしまうというのが分かるかと思います。パスワードの取り扱いについてはくれぐれもご注意を。 MD5-Passwo

FullproofはJavaScriptベースの全文検索エンジンです。高速に動作します。 Webサイトのコンテンツが充実してきたら欲しくなるのが検索機能です。Google検索を使っても良いですが、ここではFullproofを紹介します。何とJavaScriptベースの全文検索エンジンです。 色検索エンジン。 動作は高速です。 動物検索エンジン。 ゲーム検索エンジン。スコアが表示されています。 スコアの高いデータが上に出ます。 FullproofはHTML5のローカルストレージに対応し、WebSQLやIndexedDBにも対応します。Unicodeをフルサポートしています。スコアによって順位が決定します。発音記号に対応しますが、現在は英語とフランス語のみとなっています。JavaScriptだけとあって動作は高速です。 FullproofはHTML5/JavaScript製のオープンソース・ソ

J2ObjCはJavaのコードをObjective-C（iPhone/iPad）に変換するソフトウェアです。 iOSアプリをObjective-C以外のコードを動かすには二つの方法があります。一つはランタイムを内蔵して動かすもの、もう一つはプログラミングしたコードをObjective-Cに変換してしまう方法です。J2ObjCはその後者、JavaをObjective-Cに変換してしまうソフトウェアです。 元のコード。シンプルです。 変換しました。 変換されたHello.hです。 こちらはHello.m。 さらにコンパイルします。 そのまま実行できます。 x86 64bit向けの実行ファイルとして生成されました。 まだ簡単なコードでしか実験していませんが、それでもJavaのコードをObjective-Cに変換できました。J2ObjCの目標はMac OSX上ではなくiOS上で動くObjectiv