Articles tagged 'CSS'

ウェブサイトのテキストを雪のように降らすウェブアプリCSSnowflakes

-
CSSnowflakes
CSSnowflakes

※Android未対応、IE未確認

フォームにどこかのURLを入れてプレイボタンを押すと、サイトを取得してYahoo!の日本語形態素解析APIに渡し、その結果を雪のように降らせます。ただし、形態素解析は100KBの制限があります。

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つは前後のスライドを重ね合わせて前のスライドをトランジションさせる方法です。

CSSアニメーションをjQuery.animateっぽく使えるプラグイン jQuery.CSS3Animate.js を作りました

-

CSSアニメーションが使えるブラウザではCSSアニメーションを使い、それ以外ではanimate関数を使うといった場合にanimate関数と同じような使い方ができれば振り分けが容易になるので、これをプラグインにしてみました。

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

-

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

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

-

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

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

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

-

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

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

-

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

最近のこと

-

前に書いたのは6月か。

ヘテムルにアカウント作ろうとしたら「110chang」が使えなかった。お試しで使ったアカウントが残っているのか、誰かが取ったのか・・と思って「110chang」で検索してたらたまたまこんなサイト見つけた。

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

-

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

aikoのYouTube最新動画【aikotube】β版を作った

-

いきおいで作ってしまった。 突貫なのでソースとかひどいもんだけど。

久しぶりにJavaScriptでいろいろやってみた

-

いつのまにか半年も経っていた・・・ ちょっと実験サイトを作りました。

http://www.curoko.net/

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

-

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

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

-

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

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

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

-

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

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

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

-

psuedo_frame2.png