HTML5 の Drag and Drop API と File API を使ってファイルアップロードを実装する - しばやん雑記
HTML5 の Drag and Drop API を使うことで、ブラウザにドロップされたファイルの情報を扱うことが出来ます。そして File API を組み合わせることで、ファイルの中身まで扱うことが出来るようになります。 そして FormData オブジェクトと XHR を組み合わせることでアップロード処理までを実装することが出来ます。完成図はこんな感じです。 今回は JavaScript の処理が中心です。jQuery を使っているので追加してくださいね。 $(function () { var uploadFiles = function (files) { // FormData オブジェクトを用意 var fd = new FormData(); // ファイル情報を追加する for (var i = 0; i < files.length; i++) { fd.append(
Chrome紹介ページに隠された、イケてるHTMLコーディングテクニックとGAの最新版コードみたいなの - Web Analytics Latte
CMでやってるChromeの紹介ムービーをなにげなく見てたら、ちょっとおかしいことに気づきました。最先端ブラウザであるChromeの、その紹介サイトとなれば当然HTML5対応してるはず、と思ってみて気づいた点です。 HTMLソースを眺めてみて、気づきました。これがナウいソースなのかと関心する点が多々ありますが、2点、すげぇ！と思ったところがあるので紹介します。 １．Google Analyticsのタグが最新版を超えてる GAの貼り付けタグが公式のものではないことがまず1点目の違和感です。通常はこんな感じでゴチャゴチャしてるんですが //before <script type="text/javascript"> var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-XXXXXXXX-1']); _gaq.push(['_trackPag
新規でサイトを作るのに使えそうなの一式。Ver 3
随分前に、Ver2の見直しをして3になってたんですけど、公開してなかったので今更ながら公開です。 中身は2を使ってみて、社内のマークアップエンジニアからフィードバックもらったり、自分でも違和感が有った部分を調整してます。 それなりの期間使ってみて、問題をあんまり感じていないので、完成度としては大分良くなったかなぁって思います。 新規でサイトを作るのに使えそうな一式。Ver 3をDL（zip：40kb） Ver 3を見る Ver.3の中身ご説明 主な変更点を。 style.cssのwidthなどのプロパティをまとめていたのをVer1と同じに。 default.cssに書かれていた、p要素のmargin-bottomの指定をstyle.cssに移動。 default.cssのfont-familyの指定を若干変更。 index.htmlにGoogleカスタムサーチ用に使えるソースを記入。 Ja
[ ﾌﾌﾇ｡ｿﾍﾅｪ･鬣ﾜ KAYAC BM11 ] ･ﾖ･愠ｰ･ﾑ｡ｼ･ﾄ､釥�ｺﾝ､ﾎ｣ｵ､ﾄ､ﾎ･ｭ･ﾛ･�
BM11 ･ﾖ･愠ｰ･ﾑ｡ｼ･ﾄ BM11 ､ﾇ､ﾏﾂｿ､ｯ､ﾎ･ﾖ･愠ｰ･ﾑ｡ｼ･ﾄ､�･遙ｼ･ｹ､ｷ､ﾆ､､､ﾞ､ｹ｡｣･ﾖ･愠ｰ･ﾑ｡ｼ･ﾄ､ﾏ｡｢･ﾖ･愠ｬ｡ｼ､ﾎｳｧ､ｵ､ｬｴﾊﾃｱ､ﾋｼｫﾊｬ､ﾎ･ﾖ･愠ｰ､ﾋﾄﾉｲﾃ､ﾇ､ｭ､�､ﾁ､遉ﾃ､ﾈ､ｷ､ｿ･�･ﾝ･､･ﾈ ･｢･ｯ･ｻ･ｵ･熙ﾎ､隍ｦ､ﾊ､筅ﾎ｡｣ｺﾇｶ皃ﾇ､ﾏﾁｴｲ靂ﾌ､ﾋ Flash ､ｽｼｨ､ｷ､ｿ､遙｢･ﾖ･愠ｰｾ螟ﾎ HTML ､ｭｴｹ､ｨ､�､筅ﾎ､ﾊ､ﾉ｡｢ｶﾅ､ﾃ､ｿ､筅ﾎ､篦ｿ､ｯｸｫ､ｫ､ｱ､�､隍ｦ､ﾋ､ﾊ､ﾃ､ﾆ､ｭ､ﾞ､ｷ､ｿ｡｣ ､ｳ､ﾎ･ｨ･ﾈ･熙ﾇ､ﾏ｡｢･ﾖ･愠ｰ･ﾑ｡ｼ･ﾄ､ﾎ JavaScript ､ｯｾ螟ﾇｵ､､ﾄ､ｱ､�､ﾙ､ｭ｡｢･ｭ･ﾛ･讀ﾎ･ｭ･ﾛ･ｵ､ｫｾﾋ､ﾞ､ﾈ､皃ﾞ､ｹ｡｣ 1. ﾌｾﾁｰｶﾖ､ﾎｽﾅﾊ｣､ﾋｵ､､ﾄ､ｱ､隍ｦ
文字列から要素を作りたいときはinnerHTMLではなくcreateContextualFragmentを使う - 素人がプログラミングを勉強していたブログ
追記：ベンチマークをコメントを元に修正 文字列から要素を作りたい場合、 var temp = document.createElement('div'); temp.innerHTML = '<span>foo bar fizz buzz!</span>'; とやることが多い。 だが、不要なdiv要素ができて気持ち悪いし、for文でchildNodesをひとつずつ処理する必要があって、不便。 divの中にhead要素を入れることはできないので、innerHTML=''としても、要素は作られない。 RangeのcreateContxtualFragmentを使うと、こういった問題を避けることができる。 例えば、上のコードをcreateContextualFragmentを使って書き直すと、 var range = document.createRange(); range.createCon
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
