Archived
110

Articles tagged 'HTML'

Knockout.jsと東京メトロAPIで出入口検索アプリを作りました

案件でKnockout.jsを触って感触が良かったので何か公開できるものを考えました。

以前、東京メトロAPIのアプリコンテストに応募して残念ながら落選したのですが、API自体はありがたいことに継続して運用されているので、現在地や出先の住所から一番近い東京メトロの出入口を検索するアプリを作ることにしました。

Dokokara.info どこから(東京メトロの駅に)入るのが近いかわかるアプリ

dokokara.info
イントロダクション
dokokara.info - find exit of Tokyo Metro
出入口検索
dokokara.info - find route
ルート検索

東京メトロAPIのアプリコンテストに応募しました

東京メトロ列車位置情報アプリmetloc

コンテストの公式サイト

※一部ブラウザに最適化できていません。アクセスする前に注意事項をご覧ください。

metloc  東京メトロ列車位置情報アプリ
列車の詳細情報の様子
metloc  東京メトロ列車位置情報アプリ
遅延が発生している様子

IE8でRespond.jsのブレークポイントが違う

私も最近はレスポンシブ案件を受けることも多くなってきていまして、レガシーIEに対応する際は個人的な経験からRespond.jsを使用しています。(masonry.jsを実験した時にcss3-mediaqueries.jsは問題があった)

PCサイズの時だけにjQueryのプラグインを適用したい、といった状況で、ブレークポイントに合わせてJavaScriptを発火する必要があったのですが、どうもIE8だけブレークポイントが違っているので調べてみました。

WebWorkerと遺伝的アルゴリズムでウェブアプリ的なもの

きんどるでついポチッとしてしまった「マッチ箱の脳」という一般向けの人工知能の入門書を読んでみたところ、第1章のおやつの例が気に入ったのでゴリっと作りました。

【脱Dreamweaver】Middleman導入メモ

MiddlemanはRuby製静的サイトジェネレータ メタ言語サポートで高速コーディング(できるはず)compassも同梱 ライブリロード(Ctrl+Rとかしなくてよい)

いまさらだけど自前でJavaScriptスライドショー書いた

数々のJavaScriptスライドショーを使ったり書いたりしてきましたが、自分なりに機能を盛り込んだものを作りました。実装は2種類あります。1つは、スライドを配置したコンテナごと動かす方法、もう1つは前後のスライドを重ね合わせて前のスライドをトランジションさせる方法です。

あけましておめでとうございます

あけましておめでとうございます 年賀状くれた方ありがとうございました。

「関東地方鉄道運行情報」を作成しました。

自分プロジェクトで関東地方の鉄道運行情報を一覧できるサイトを作りました。

関東地方鉄道運行情報(試験中)

最近のブラウザでの3点リーダーや引用符の表示について

3点リーダー(…)や引用符(“、”)の表示のされ方を主要ブラウザで比べてみました(↑なんか下についてるの気になりますよね)。

エヴァっぽい輪番停電スケジュールを作ってみました

東電のPDFが見にくいなあと思って。

路線/駅名/最寄駅データサービス×標高算出API×canvasタグ

CANVASタグにAPIで取ってきたデータを描画してみた。感覚としてはFlashのGraphicsクラスをいじるのに近いです。

JavaScriptでスクロールバーをつくる

JavaScriptでスクロールバーを作ってみた。

ドラッグ&ドロップで入れ替え可能なリスト

JavaScriptでドラッグ&ドロップ。

リスト要素(ul,li)をセンタリングする

ページ分割などでよくあるインターフェース。これをコーディングするとき、ul要素(とli要素)ではセンタリングできないのでtable要素を使っていました。

リスト要素のセンタリング

FlashとJavaScriptでHTMLページにページめくりをつける

最近、FLASHのカタログサイトなんかでページめくりのメタファーを使ってるのを見て、これを普通のHTMLサイトにも使えないかという思いつきで作りました。

turnpage

チェックボックスをカスタマイズする

ブラウザごとに異なるチェックボックスの外観を統一したい!

WEB制作者は自腹を切ってでもWindows VISTAを普及させた方がいい

※このエントリーは愚痴ですので、ご承知おきを。

なぜなら、VISTAが普及すればするほどIE6の使用率は下がり、無駄なバグつぶしに時間を浪費しなくて済むからだ。まあ、普段おれはstrictでコーディングしてるからどっちでも関係ないけどな!

IE6で疑似フレーム第3弾【JavaScriptを改良】

psuedo_frame2.png

IE6で疑似フレーム第2弾【JavaScriptも使ってみたよ】

psuedo_frame.png

IEがローカルのアクティブコンテンツ再生にうるさい

IEは、ローカルでの の使用や SWFファイルの再生などをしようとするとブラウザのウィンドウ上部に「セキュリティ保護のため、コンピュータにアクセスできるアクティブコンテンツは表示されないよう・・・」というアラートがでる。画面が真っ白のままでこのアラートはユーザー体験としてひどすぎる。