JavaScriptのツールをいろいろUpdate(主に微修正)

JavaScriptのツールの細かい点をいろいろ直しました。

変更点は下記のとおりです。ほとんど内部的な修正というかソースを整えただけのものが多いです。動きや表示に影響があるものは太字にしました。

 

GAddress Finder

  • ver. 0.1.2
  • セミコロンを補完した

 

JSONDecoder.js

  • ver. 0.1.2
  • セミコロンを補完した

 

PHP-Manual.css

  • ver. 0.1.4
  • フォントを変更Pryn.cssの成果を取り込んだ)
  • 角丸のFirefoxとWebkitの独自実装形式を削除

 

Universal Colors

  • ver. 0.1.1
  • セミコロンを補完した

 

Yahho Calendar

  • ver. 0.4.6
  • カレンダー表示中にESCキーを押されたら、カレンダーを消すようにした
  • ちょっとリファクタリング

 

Yahho Sticky Footer

  • ver. 0.1.3a
  • bodyの左右のmarginを指定しない(YUIでの指定を上書きしない)ようにした

 

Yahho Suggest

  • ver. 0.1.1a
  • YUIのバージョンは2.x系の最新を使うようにした

 

すっきり。

余談ですが、先日たまたま一休.comを見たら、Yahho Calendarをカスタマイズされたものが使われててびっくりしました。嬉しいやら恥ずかしいやら。オモハユイというやつでしょうか。

jQuery UIの各テーマの色が人目で分かる便利ツール

jQueryのサブプロジェクトであるjQuery UIは、豊富なテーマとDatepicker等のウィジェットが用意されていて、なかなか便利です。

しかしウィジェットに比べて、class属性の指定だけで簡単にサイトを彩ることが出来て便利なThe jQuery UI CSS Frameworkの存在が意外と知られていない気がします。
そしてその原因は、jQuery UI ThemeRollerで簡単に見た目を確認できる各ウィジェットに比べて、その効果がすぐに分かるページが用意されていないからではないでしょうか。

そこで、各テーマを適用した時にそれぞれのCSSクラスがどんな背景やフォントになるかをひと目で確認できるツール、名付けてThe Colors Viewer for jQuery UI CSS Frameworkを作りました。

これがあれば、着せ替え感覚で気軽にテーマを選んだり、classを変更したりできると思います。ぜひご活用ください!

Pryn.js & Pryn.cssバージョンアップ(0.2.5)

読み込むだけでWebページの「おもてなし度」を向上 – Pryn.js & Pryn.css [ゼロと無限の間に]

Pryn.jsの主な変更点

  • HTML5のautofocus属性に対応(autofocus未対応のブラウザでもautoでfocusできる)
  • HTML5のplaceholder属性に対応(placeholder未対応のブラウザでも、テキストボックスに未入力の場合のみメッセージをグレイアウトで表示できる)
  • select要素の選択されているoption要素を簡単に取得できるfunctionを追加(Pryn.getSelected())
  • 四角いBOXをちょっとだけ角丸っぽく見せられるfunctionを追加(Pryn.round())
  • formをsubmitした時のマウスカーソルを「待ってる」感が出るものに変更
  • Stringを拡張してword2regexp()を持たせるのをやめた

Pryn.cssの主な変更点

  • importするYUIのCSSのスキームをスキーム指定無しからhttpsに変更(スキームなしだとIEが2回読み込んでしまう問題を回避するため)
  • テキストボックスの背景色を変えたときに枠線の見た目が変わらないようにした(IE6は非対応)
  • ボタンの見た目のブラウザ間の差異を小さくした。かつ、ボタンを押しやすいように左右のpaddingを広めにした
  • フォントはIE7・IE8はメイリオ、Macはヒラギノ角ゴ、それ以外はブラウザの設定のフォントになるようにした
    (IE6やFirefoxは設定しないとClearTypeが有効にならないので自動でメイリオにするのはやめた。ブラウザの設定等でメイリオにしている人にはFirefox等でもメイリオになる)
  • リンクの色を綺麗な青等にした
  • 角丸(border-radius)のブラウザ別のサンプルを入れた

なんかゴチャゴチャしてきたので、JavaScriptはjQueryベースで書き直したくなってきた。

CSSはjQuery UI CSS Framworkベースで?でもYUIないとクロスブラウザ的に辛いかな...