Directory

← Back

drag-resize

A touch friendly resizable container with resize events.

Author

Rating

Popularity

<100

[ This description is mirrored from README.md at github.com/jifalops/drag-resize on 2019-05-10 ]

Published on webcomponents.org

drag-resize

A touch friendly draggable and/or resizable container.

Installation

bower i -S jifalops/drag-resize      # Polymer 2.0 class based
bower i -S jifalops/drag-resize#^0.2 # Polymer 2.0 hybrid (1.x compatible)

Usage

  • Set which directions are draggable and which edges are resizable. All possibilities are enabled by default.
  • Optional: set edge/corner borders, mouse cursors, corner gradient color.
  • Optional: listen for on-resize or on-drag events.

Demo

<drag-resize drag="left right" resize="bottom right">
  <div style="height:100px; width:100px; background-color:lightblue;"></div>
</drag-resize>

Full demo: webcomponents.org | github.

API: webcomponents.org

Contributing

  1. Fork it on Github.
  2. Create your feature branch: git checkout -b my-new-feature
  3. Commit your changes: git commit -am 'Add some feature'
  4. Push to the branch: git push origin my-new-feature
  5. Submit a pull request

License

MIT

Compatibility

(Loading compatibility data...)

Was this helpful? Need more help?
Leave a comment or a question below. You can also join the chat on Discord or ask questions on StackOverflow.

Version

Dependencies

  • polymer##^2.0.0
  • iron-flex-layout##^2.0.0
  • shadycss##^1.0.0
Released
2017-08-22
Maturity
IMPORTED
License
MIT License

Compatibility

Framework
Polymer 2.0+
Browser
Browser Independent

drag-resize - Vaadin Add-on Directory

A touch friendly resizable container with resize events. drag-resize - Vaadin Add-on Directory
**[ This description is mirrored from README.md at [github.com/jifalops/drag-resize](https://github.com//jifalops/drag-resize/blob/1.0.1/README.md) on 2019-05-10 ]** [![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg)](https://www.webcomponents.org/element/jifalops/drag-resize) # drag-resize A touch friendly draggable and/or resizable container. ## Installation ``` bower i -S jifalops/drag-resize # Polymer 2.0 class based bower i -S jifalops/drag-resize#^0.2 # Polymer 2.0 hybrid (1.x compatible) ``` ## Usage * Set which directions are draggable and which edges are resizable. All possibilities are enabled by default. * Optional: set edge/corner borders, mouse cursors, corner gradient color. * Optional: listen for `on-resize` or `on-drag` events. ## Demo ```html
``` Full demo: [webcomponents.org](https://www.webcomponents.org/element/jifalops/drag-resize/demo/demo/index.html) | [github](https://jifalops.github.io/drag-resize/components/drag-resize/demo/). API: [webcomponents.org](https://www.webcomponents.org/element/jifalops/drag-resize/drag-resize) ## Contributing 1. Fork it on Github. 2. Create your feature branch: `git checkout -b my-new-feature` 3. Commit your changes: `git commit -am 'Add some feature'` 4. Push to the branch: `git push origin my-new-feature` 5. Submit a pull request ## License [MIT](https://opensource.org/licenses/MIT)
Online Demo
View on GitHub
Documentation
GitHub Homepage
Issue tracker

drag-resize version 0.1.0
### Dependencies * polymer##^2.0.0

drag-resize version 1.0.0
### Dependencies * polymer##^2.0.0

drag-resize version 0.2.0
### Dependencies * polymer##^2.0.0 * iron-flex-layout##^2.0.0

drag-resize version 0.2.1
### Dependencies * polymer##^2.0.0 * iron-flex-layout##^2.0.0

drag-resize version 0.2.2
### Dependencies * polymer##^2.0.0 * iron-flex-layout##^2.0.0

drag-resize version 1.0.1
### Dependencies * polymer##^2.0.0 * iron-flex-layout##^2.0.0 * shadycss##^1.0.0

Online