lifememo.jp 2021 著作権. 不許複製 プライバシーポリシー
イベントの種類とデフォルトの動作をキャンセル ドラッグ&ドロップを実現しようにもブラウザにはドロップされたものを表示するというデフォルトの動作があるので、そいつをキャンセルする必要がある。ただしドラッグを開始する「dragstart」は特にキャンセルする必要はない。 とくにhtml5(javascript)でドラッグ&ドロップを実現する場合は、「dragover」のイベントをキャンセルするのは必須のようです。 ドラッグ&ドロップを行うには下記のようなイベントが主にあります。 //ドラッグする要素をドラッグするとき target.addEventListener("dragstart",function(event){ },true); //ドロップ領域にドロップされたとき target.addEventListener("drop",function(event){ event.preve
HTML5のDrag and Drop APIとFile APIを試してみました。 Drag And Drop APIは HTML上の要素のドラッグアンドドロップをサポート File APIとの連携でデスクトップからのドラッグアンドドロップをサポート 1番はHTML5でなくてもjQuery等を用いれば実現可能ですので、File APIとの連携を試します。 File APIのサンプル jQueryでFile APIを使うために以下のおまじないを実行します。 jQuery.event.props.push('dataTransfer'); DropイベントとFile APIとの連携にはevent.dataTransferプロパティを使いますが、jQueryのイベントオブジェクトにはdataTransferが存在しません。このおまじないで、jQueryのeventオブジェクトにブラウザネイティブ
現在W3Cで仕様策定が進められているFile APIを使うと、JavaScriptからローカルファイルの情報や内容にアクセス出来るようになります。 Firefoxでは3.0時代から似たような機能が実装されていたようですが*1、今回やや仕様を変更した上で標準化されます。 まだワーキングドラフトの段階ですが、Firefox 3.6 RC1*2に既にほとんどのAPIが実装されていますので、今すぐに使ってみることができます。 そこで、試しにこんなサンプルを作ってみました。Firefox 3.6で以下のページにアクセスしてみてください。 JavaScriptでネガポジ反転 ファイル選択欄でビットマップファイル(.bmp)を選択、あるいはブラウザにドラッグアンドドロップすると、その画像をネガポジ反転(階調の反転)して表示します。複数選択も可です。*3 *4 ↓実行例 ファイル加工の際にサーバと一切通信
「5000枚の写真をアップロードできるWebアプリがほしい」と無茶な依頼があったので、HTML5のFile APIを使ってサンプルを作ってみました。 サンプル) http://5463440d.dotcloud.com/ ソースコード) https://github.com/jou4/multi_fileupload ※上のサンプルは、サーバーが受け取ったファイルを保存しないのでアップするだけのものです。 ※またリクエストのサイズも制限されているので、大きなファイルはアップできません。 ドラッグ&ドロップは、ondragover, ondragend, ondropといったイベントで制御します。 jQueryを使うのであれば、bindメソッドを利用してこんな感じでしょうか。 $("#holder") .bind("dragover", function(){ this.className
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(
Inkscapeとは Inkscapeは無料で使える「ベクトル画像編集ツール」です。「ベクトル画像」とは、点や線や色などのデータを数値で記録している画像のことで、拡大縮小しても画像劣化がないというメリットがあります。プロのデザイナーやイラストレーターが使うことで知られているアドビシステムズの「Illustrator」も、ベクトル画像を扱えるソフトのひとつ。Inkscapeは、無料で使える簡易版Illustratorだと思ってください(多少の語弊はありますが)。ちなみに、ベクトル画像に対して、デジカメ写真などピクセル(画素)で構成された画像のことを「ラスタ画像」と呼ぶこともあります。 Inkscapeは、イラストやロゴの作成に向いています。Photoshopなどのレタッチ(写真加工)ソフトでは拡大すると画質が劣化しますが、Inkscapeで描いたベクトル画像は拡大してもオリジナルサイズと同じ
写真じゃないの? DiegoKoiとして知られるイタリア人アーティストのDiego Fazio氏。彼が使う道具は鉛筆のみ。超写実的技法によって、まるでモノクロ写真のような絵を描き上げています。 一枚の絵にかける時間はおよそ200時間。通常のデッサンのように全体的に仕上げていくのではなく、端から一気に描き込んでいくようです。制作過程はこんな感じ。 ひょえー! 描き込まれた部分と白い部分とのコントラストがすごいの一言。彼のサイトではこの他にも驚きの作品が多数掲載されています。その中から一部を抜粋して紹介します。 ホントに描いたの?? 何度見ても目を疑ってしまいますが、全て鉛筆で描かれた絵です。2007年から本格的に絵を描き始め、今では世界的にも大絶賛されているDiego Fazio氏。実は、まだ23歳というから驚きです。一度でいいから本物を見てみたいですね。 アートに関する記事はこちらから!
先日から酒を飲むようになったので今日は酔っぱらってお送りしております。 こないだね、焼肉屋に行ったんですよ。 とっても美味しかったんですね。希少部位をジャンジャンだしてくれるお店で、肉の柔らかさといい、小シャレた雰囲気と良い、もう最高だったんですね。もうふわふわっと。是非あのお店は行くべきだと思いますね。 とかなんとか言ったって、全然その肉のおいしさが伝わらないんですよ。 なんでかわかりますか?それはですね。 写真が無いからなんです。 写真が無いとやっぱりさ、そういう食べ物の美味しさが全然伝わらないと思うんですね。 とか思って、写真を携帯で取るじゃん?そうするとどうもぼやけた感じの写真が出来上がってイマイチな感じになる訳よ。そこで、カメラを買う訳ですよ。デジ1とか。そうするとさ、今度は画像は鮮明だけど、どうにもアップの感じがイマイチで、構図的においしそうじゃないとかあるわけよ。 そうなって
僕がいつも読んでいるブログに下記の様な記事が出ておりました。 株式会社カヤック 決算公告 まさかの赤字 こちらの記事にもありますが1億円以上の赤字でIPOは当分先でしょうね。 ここにはまさかの赤字と書いてありますが僕的には予想通りの決算という感じです。 「なんでそんなことわかるの?」と言われそうですがもう業界でカヤックの話はほとんど聞きません。 聞くと言えば大量に人が辞めているという話ぐらいですかね。 先月も元カヤックの方とお茶をしてきましたが結構バタついているようで・・・。 なんか社内には「辞めたい奴は辞めれば良い」的な風潮まであると聞きます。 そもそもで面白法人と謳っているものの聞く限りだとかなり給料が安いですので、 比較的激務なソーシャルゲーム業界だと目移りしてしまうのも事実ですよね。 あとやっぱり個人的に思うのがヒットタイトルの不足も象徴的かと思います。 昔は「ぼくらの甲子園」や「
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く