画像選択時にサムネイルが出て分かりやすい進捗付きjQueryファイルアップローダー「jQuery File Upload Demo」:phpspot開発日誌
画像選択時にサムネイルが出て分かりやすい進捗付きjQueryファイルアップローダー「jQuery File Upload Demo」 2012年03月19日- jQuery File Upload Demo 画像選択時にサムネイルが出て分かりやすい進捗付きjQueryファイルアップローダー「jQuery File Upload Demo」 Twitter Bootstrap を使ったアップロードのデモなんですが、ファイルを選択するとサムネイルが直ぐに出てくれてます。（複数選択が可能） そして、選択後、すぐアップロードは開始されず、Startボタンを押すと開始されます。 なんか選択したらすぐアップされたなんていうケースがありますのでこれは安心です。 更に、個別にキャンセルが可能なので、アップしようと思った画像と違う物を間違ってアップする事をサムネイルで未然に防げます。 アップした後も、Del
HTML5 drag & drop image file uploader | jQuery Plugins
droparea HTML5 drag and drop image file uploader droparea is a HTML5 drag and drop image file uploader jQuery plug-in and a php script for server-side. I've only tested it on Google Chrome (11.0.696.65) and Mozilla Firefox (3.6.17) and it works enough for me for now! <div class="droparea spot" data-width="460" data-height="345" data-type="jpg" data-crop="true" data-quality="60" data-folder="sample
HTML5+jQueryのドラッグ&ドロップに対応したアップローダー・droparea
Gmailライクにローカル環境からブラウザに ドラッグ&ドロップで画像をアップロード可能 にするHTML5+jQuery製のアップローダー droparea。今後、こうしてキーボードを使う 頻度が減っていくんですかね・・HTML5の 出現で一気に加速した印象ですね。 jQuery HTML5 UploaderやjQuery File Uploadの後発に当たりますね。 イメージアップローダーです。Gmailライクにドラッグ&ドロップでアップロード出来ます。 コードs = { 'init': m.init, 'start': m.start, 'complete': m.complete, 'instructions': 'drop an image file here', 'over' : 'drop file here!', 'nosupport' : 'No support for t
jQuery File Upload Demo
jQuery File Upload Demo File Upload widget with multiple file selection, drag&drop support, progress bars, validation and preview images, audio and video for jQuery. Supports cross-domain, chunked and resumable file uploads and client-side image resizing. Works with any server-side platform (PHP, Python, Ruby on Rails, Java, Node.js, Go etc.) that supports standard HTML form file uploads. Pintura
CSS2/DOM - Styling an input type="file"
Credits wholly go to Michael McGrady, who invented this technique. A browser must support opacity to support this technique. Therefore it doesn't work in Explorer 5.0 on Windows, Explorer 5 on Mac and Opera. A reader suggested adding a keyup event to the real input box so that you can copy the text the user types to the fake one. This page has been translated into Chinese and Italian. Of all form
input type='file'で選択可能なファイルをjQueryで指定する | Base Views
長年実装されずに来た属性なので、Internet Explorerやfirefoxへの実装は今後も期待できないでしょう。それに、ファイル選択ダイアログの「ファイルの種類」のプルダウンメニューをいじれば、結局は指定した拡張子以外も選べてしまうわけです。 jQuery Multiple File Upload Pluginを使う ということで、こちらで紹介されているjQuery Multiple File Upload PluginというjQueryプラグインを使ってみます。このプラグイン、本来の目的は複数ファイルのアップロードを行うことみたいですが、受け入れ可能ファイルタイプのコントロールも厳格でいい感じです。 jpgのみ選択可能なフォーム <script type="text/javascript" src="http://www.google.com/jsapi"></script> <
Sendoid - Instant, Private, P2P File Transfers
Send a file instantly and securely with SENDOID file transfer. Sendoid lets you send files to anyone with an internet connection via an on-demand peer-to-peer direct connection for free! Your file goes straight from you to its destination-- no server space required.What is Sendoid? Sendoid is an on-demand peer to peer transfer system. It makes transferring any size file between two people as simpl
Flash?いいえ、HTML5です: ファイルのドラッグ&ドロップによるフォトアップロード機能について - mixi engineer blog
はじめまして。コミュニケーションサービス開発部の澤と申します。コーヒーとカレーをこよなく愛する新卒2年目の新米エンジニアで、弊社Webのフロントエンドを主に担当しています。最近はmixiスマートフォン版(mixi Touch)の開発にも精力的に取り組んでいます。 さて、本日はPC版のmixiで1つの機能をリリースいたしました。ファイルをWebブラウザにドラッグ&ドロップするだけで写真をmixiフォトにアップロードできるもので、HTML5 File API※1を採用しています。本記事ではこの機能について色々とお話をしたいと思います。 なにこれ? 以下では、ドラッグ&ドロップによるアップロード機能を「本機能」と呼びます。 百聞は一見にしかずです。本機能のプロモーションムービーがありますので、まずはこちらをご覧ください。 動画では下記を説明しています。 従来のアップロード方法からドラッグ&ドロッ
input type = "file"のボタンをcssと画像でかっこよくする :: Lunatic-Code
以前input buttonを画像にする、とかやったんですが、 input type="file"も画像化したいなぁ、と。 んが、どうやら一筋縄じゃいかなさそうだ。 というのも、レンダリングエンジンによって、 デフォルトの表示方法が違う。 IE(Trident)やFirefox(Gecko)、Opera(Presto)だと、左側にテキストエリアっぽいのがあって、その右にボタンがある。 が、googleChromeやSafari(WebKit)だと、ボタンがあってその右側にテキストだけが表示される。 まぁ、時点で、input:fileをどうにかするよりも、代替コンテンツで対処するしかないわけで。 問題点を挙げると・・・ ・CSSでwidthやheightを指定しても、個別に幅の指定や比率の指定も出来ない。 ・また、Firefoxはcssの幅を無視する。sizeに値を入れてやら
PHPベースの使いやすそうなAjaxファイルマネージャ「PGRFileManager」:phpspot開発日誌
PGRFileManager - Manage your files easily PHPベースの使いやすそうなAjaxファイルマネージャ「PGRFileManager」。 ブラウザ上から認証して、ファイルの追加、移動、リネーム、削除、フォルダの作成といった一連のファイル操作が可能。 画像だったらちゃんとサムネイル化してくれる上に、CKEditorによってその場で編集することも出来ます HTMLなんかはその場で編集できます。 なかなか便利そうですね。 関連エントリ まるで何かのOSに搭載されているようなブラウザベースの高機能ファイルマネージャ「elFinder」 PHP+MySQLで作成されたAjaxベースのWeb2.0ファイルマネージャ:Relay PHPとAjaxを使ったWEBベースのファイル管理ツール「PHP Navigator」
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
画面遷移なしのAjaxでファイルアップロードするjQueryプラグイン10:phpspot開発日誌
http://hakuhodo.filecheetah.jp/
Check for file size with JavaScript before uploading – Kavoir LLC
Google 翻訳
Pydio