webページにローカルファイルをドロップ可能にするjQueryプラグインを作ってみた
こんにちは。 セミが鳴き出しましたね。夏、嫌な季節です。 さて、Macで良いリネームアプリを探しているのですが、 なかなか決定版が見つからずに嘆いています。 そんな時ふと思いました。 (使ったことないけど)HTML5のFileAPI使えばリネームって出来るんじゃないか？ あと、いちいちファイルをチューザーからファイルを選択するのも面倒だし、 HTML5のDrag&DropAPI使ってブラウザにファイルをドロップできるようにしよう！ と思いFileAPIとDrag&DropAPIを調べてみたら、 ちょっとした小物を作るのにも地味に面倒だったのでメモを残します。 File APIとは？ File APIとは、HTML5で提供されているAPIです。 ローカルファイルやディレクトリの読み書きが出来るオブジェクトです。 例えば、バイナリデータを扱うBlobや、 ファイルの読み取りを行うFileRea
jstree
jsTree is jquery plugin, that provides interactive trees. It is absolutely free, open source and distributed under the MIT license. jsTree is easily extendable, themable and configurable, it supports HTML & JSON data sources and AJAX loading. jsTree functions properly in either box-model (content-box or border-box), can be loaded as an AMD module, and has a built in mobile theme for responsive des
【jQuery UI】要素をドラッグ&ドロップで並び替え【Sortable】 - Qiita
jQuery UI のSortable機能を利用して、要素を動的に並び替えます。 実務で使う機会があり、またどこかで使いそうな感じもするので備忘録的なメモ。 目的 HTML要素をドラッグ&ドロップで動的に並び替える 環境 ECMA Script5 jQuery 1.11.1 jQuery UI ソースコード <!DOCTYPE html> <head> <meta charset="UTF-8"> <title>テスト</title> <!-- CSS読み込み --> <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css"> <!-- CSSを記述 --> <style> .sort-elements { heigh
HTML5 Sortable
HTML5 Sortable is a jQuery plugin to create sortable lists and grids using native HTML5 drag and drop API. DEPRECATION NOTICE This project is not mantained anymore. I recommend using RubaXa's Sortable or voidberg's fork instead. Why another sortable plugin? Because it's better. Well, If you want to read the whole story read it here. Features Less than 1KB (minified and gzipped). Built using native
jQuery UIのDraggableで快適なドラッグアンドドロップライフを！ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。づやです。 さて、要素をドラッグアンドドロップさせてなんかしたいっていう要望は割とあると思うのですが、個人的には5年くらいその処理が必要とならず、あまり考えることがありませんでした。 そこで最近はどんな感じでできるのかなあ、と思っておりまして、ちょっと調べてみたことをまとめます。 5年前はprototype.jsとプラグインを利用していたのですが、今回はjQueryとプラグインで実装してみたいと思います。 便利なjQuery UIのDraggableを利用します と言っても、jQuery UIを利用すれば超簡単にできる模様なので、まずは作ってみました。 ※コードは大事な所だけ抜粋しています <html> <head> <!-- まずjQueryとjQuery UIを読み込みます。今回はCDNから読み込んでます --> <script src="//ajax.googleapis
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://www.dropzonejs.com/
