jQuery Mobile 1.1RCを東京通勤道中に適用してみた

jQuery Mobile 1.1.0のRC1が出たので、さっそく東京+通勤+道中に導入してみました。(ついでにFlic 100Kにも。)

jQuery Mobile 1.0.xではスクロールすると明滅してぎこちなく付いてくる奥ゆかしさが不評だったStickyなヘッダーが普通に固定になっていい感じですね。

IE8(IE9の互換モードで確認)ではレイアウトが思いっきり崩れたり、そもそも表示されなかったりしますが、もう気にしないことにしましょう…(IE7-9もAグレード扱いだから、きっとRC2で治るはず…だといいな。)

Google Mapper V3に現在位置取得機能を追加しました

Google Mapper V3をバージョンアップしました。バージョン0.7.0です。

変更点は、Geolocation APIを使って現在位置を取得できるようにしたことです。
要するにnavigator.geolocation.getCurrentPosition()を呼び出すというのが主な処理なのですが、その前後の面倒そうなことも合わせてやるので、呼び出す側は楽になります。
まあ、どちらかと言えば、Geolocation APIの使い方の覚え書きという側面が強いかも…

主にスマートフォンで使われる機能ですが、PCでも無線LANのあるノートPC等ならまあまあ使えます。(古いIEは使えません。新しいIEは…使えるのですが…残念です。)

でもiPhoneだとgetCurrentPosition()だけでなく、watchPosition()とか使ったりしないとうまく取得できなくてタイムアウトしているようですが、とりあえず今回はそこまで追ってません。

Yahho Calendar少しだけバージョンアップ(0.4.5)

YUIのJavaScriptカレンダーを日本語化&ポップアップ対応&祝日も表示 – Yahho Calendar [ゼロと無限の間に]

ほとんど変わってないけど。

主な変更点

  • YUIのバージョンを、リビジョンまでの指定から、常にバージョン2.x系の最新を使うように変更
  • IEでカレンダーの後ろにテキストボックスがある場合にテキストボックス内のマウスカーソルがカレンダー越しに透けて見える問題を解消

いつも思うけど、Yahho Calendarのバージョンアップはもうこれで最後かな。

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ないとクロスブラウザ的に辛いかな...

新サービス「ものすごい地図」を公開した

ものすごい地図 – 伝説のリョコウバトのように日本、アメリカ、ヨーロッパ、そして世界を覆い尽くすものそれは…

地図上で各国言語のWikipedia情報+写真を見られる地図を作ってみた。
今回はなんとなく英語版も用意した。片言英語だけど。

意外な場所で英語のWikipediaに情報があったりすると興味深い。

YouTubeは中途半端にしか動かないから外した。

それとFirefoxだと見れたり見れなかったりする。(アドオンのせいか?)
Google Mapsは昔からIEの方に最適化されてる気がする。IE8はそうでもないが。

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

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

Pryn.jsの主な変更点

  • IEでlabel要素内のimg要素をクリックしてもチェックが付かない問題を解消
  • ページのunload時に、操作不可にしていたformを操作可能に戻すようにした

Pryn.cssの主な変更点

  • YUIのホスティング元を米Yahoo!からGoogleに変更
  • 上記に伴い、httpsのページではYUIのロードもhttpsになるようにした

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

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

久しぶりにバージョンアップ。Beta版として細かい変更はしていたけど。

主な変更点(Pryn.js)

  • (Firefoxのみ)windowへonloadを追加しようとした場合、windowのloadイベントを待たずにDOMContentLoadedイベントでfunctionを実行するようにした
  • (IEのみ)フォームのファイルアップロード(input要素でtype属性がfile)にマウスカーソルが当たった時にマウスカーソルが手になるようにした
  • フォームSubmit後にフォームを操作可能になるまでの時間を指定できるようにした
  • label要素のクロスブラウザ対応(label要素にfor属性を書かなくても動作する)
  • 画像にtitle属性が無い場合、alt属性をtitle属性にコピーする
  • input要素に”input-<type属性の値>”というclassを付与できるようにした(デフォルトではこの機能はOff)

主な変更点(Pryn.css)

  • importするYUIのバージョンを2.5.0から2.5.2に上げた
  • Yahho Sticky Footerを取り込んだ
  • centerクラスを追加
  • デフォルトのfont-sizeとline-heightを追加

こんなとこかな。忘れてるのもありそうだけど。

Sitcky Footerとかデフォルトのフォントサイズとかは無い方が便利な時もあるけど、迷ったけど入れた。いらないならコメントアウトか上書きすればいいし。でもそのうち外すかも。

IEでクリックしなくてもFlashがアクティブになった

普通にhtml中にobject要素を埋め込んだら、今まではIEではクリックしないとアクティブにならなかったのに、いつの間にか表示するだけでアクティブになるようになっていたことに今日気付いた。

調べてみると、[IE]仕様変更:フラッシュなどのアクティブ化のクリックが不要にということで、先月くらいのWindows Updateでこっそりと変わっていたらしい。

これでもう少しこの変更が浸透したら、もうFlushFlashは要らない。せっかく作ったけど。アクティブ化以外の、Flashでよく使う設定が簡単にできるとか、毎回swfをリロードさせるとかいう機能は使うかもしれないけど。

Pryn.js & Pryn.css 細かくバージョンアップ (0.2.1)

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

主な変更点

  • Pryn.ClassAccessorでクラス名にハイフンが含まれる場合に正しく動作しないバグを修正
  • IEで、テキストエリアのスクロールバーを不要な時は非表示になるようにした
  • Firefoxで、常にスクロールバーを表示するようにした