W3C File APIを使ってJavaScriptでファイル加工 - しばそんノート
現在W3Cで仕様策定が進められているFile APIを使うと、JavaScriptからローカルファイルの情報や内容にアクセス出来るようになります。 Firefoxでは3.0時代から似たような機能が実装されていたようですが*1、今回やや仕様を変更した上で標準化されます。 まだワーキングドラフトの段階ですが、Firefox 3.6 RC1*2に既にほとんどのAPIが実装されていますので、今すぐに使ってみることができます。 そこで、試しにこんなサンプルを作ってみました。Firefox 3.6で以下のページにアクセスしてみてください。 JavaScriptでネガポジ反転 ファイル選択欄でビットマップファイル（.bmp）を選択、あるいはブラウザにドラッグアンドドロップすると、その画像をネガポジ反転（階調の反転）して表示します。複数選択も可です。*3 *4 ↓実行例 ファイル加工の際にサーバと一切通信
SCRAPBLOG : Firefox 3.1 の新しいドラッグ＆ドロップ API の基本的な使い方 （その1～イベントハンドラの追加）
サンプルコード (HTML) 2つの div 要素を配置し、一方をドラッグ元、もう一方をドロップ先とする。 ドラッグ元となる div 要素には、「draggable=”true”」属性をセットしなければならない。ただし、リンク（a 要素）や画像 （img 要素）などは、「draggable=”true”」を指定しなくても自動的にドラッグ可能となる。 ドラッグ元の要素には ondragstart, ondrag, ondragend の3つのイベントハンドラを追加し、ドロップ先の要素には ondragenter, ondragover, ondragleave, ondrop の4つのイベントハンドラを追加する。ただし、必要最低限のドラッグ＆ドロップを実装するのであれば、 ondrag, ondragend, ondragleave は省略しても問題ない。 <html> <head> <ti
本の虫: QuirksBlog: HTML5のドラッグ＆ドロップはクソだ
QuirksBlog: The HTML5 drag and drop disaster QuirksBlogで有名なPeter-Paul Kochさんが、HTML5のドラッグ＆ドロップに関して、酷くののしっている。かなり好い文章で、興味深かったので翻訳してみた。記事が長いので、blockquoteを使うのは御免を被る。 一日半もテストして、HTML5 drag and drop moduleはクソなばかりか、ゲロみてえな臭いがプンプンするってことが、いやというほど分かったね。 コイツはHTML5規格から、ソッコーで消すべきだし、もっとまともな規格が制定されるまでは、現行ブラウザは、この機能を、一刻も早く無効にするべきだ。 Web開発者は、HTML5のドラッグ＆ドロップを使うな。絶対使うな。RFC2119で規定されているMUST NOTの意味で使うな。使いたきゃ、従来通りのスクリプトで実装
HTML5 の file API と jQuery でブラウザにファイルをドラッグ&ドロップしてアップロードするサンプルを作った - @kyanny's blog
GitHub - kyanny/html5_file_api_ajax_upload_sample: HTML5 file API + ajax file upload sample HTML5 の file API というのが面白そうなのでちょっといじってみた。 デモを動かすには Plack と JSON と Path::Class が必要です。このブログ読んでる人ならどれも ready for use ですよね。もしまだのひとは cpan -i Plack JSON Path::Class でよろしく。 git clone して plackup して Firefox 3.6.x 以降で開いてください。 複数ファイルをドロップしたときになんかうまく動いてない気がするとか、 app.psgi の書き方がだいぶいい加減とか、微妙なところはたくさんあるけどとりあえず動くところまでいけたので公開
とあるjavascriptの画像生成
元ネタ：とある櫻花の画像生成、とある画像の自動生成<ジェネレータ> HTML5のcanvasを使ってやっつけ仕事。グラデーションは面倒なのでやめた。SilverLightやサーバーサイドは、もはや過去の遺物である。これからはクライアントサイドのみで、これぐらいやるのが当たり前になるべきだ。フィード経由で閲覧している人は、ご面倒ではございますが、直接見ていただいくようお願いいたします。 主要ブラウザでテストしてみた結果。 Chrome, Safari: 完璧 Firefox: なぜか@ＭＳ ゴシックが意図通りに描画されない。 Opera: canvasの文字列描画をサポートしていない。 IE: えーと……とりあえずお前はカエレ。 グラデーションは、思いのほか簡単だった。 Anonymous said... 私はWindowsでSafari 4を使っていますが、振り仮名（インデックス）の部分が
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
