読者です 読者をやめる 読者になる 読者になる

AngularJSでDraggable directiveを作った

Angular.js JavaScript

AngularJSでjQuery UI Draggableみたいなディレクティブを探していたんだけど、要件にあうものがなかったので自分で作った。

fumitoito/angular-draggable

要件としては

  • ドラッグできる
  • ドラッグ可能な軸を任意に指定できる
  • 拡大・縮小できる

という感じ。

できること

  • 要素を任意の位置にドラッグできる
  • 要素のドラッグ可能な軸を任意に指定できる(X軸もしくはY軸)
  • 要素を拡大縮小できる

インストール

bower.jsonのdependenciesに追加

"dependencies": { "angular-draggable": "git@github.com:fumitoito/angular-draggable.git" }

インスコ

$ bower install

そのうちやるかも

  • bowerのレジストリに登録
  • Droppableなディレクティブがあったほうが便利かもしれない
  • 拡大縮小は別のディレクティブに切り出すべきなのかもしれない

Issueやぷるりを貰えると喜びます。

広告を非表示にする