rotodrag-js is a mobile-friendly JavaScript drag-and-rotate library that lets you translate and rotate SVG objects with mouse or touch events.
drag and rotate javascript, drag and drop touch screen javascript, jquery drag resize and rotate image, svg drag and rotate, resize js library, svg drag and drop
How to make use of it:
To get began, embody the rotodrag-js library on the HTML web page.
<script src="rotodrag.js"></script>
Add the CSS class ‘draggables’ to the SVG component.
<svg class="draggables"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 280 150"
version="1.1"
id="svg4601"
>Add the CSS class ‘draggable’ to the SVG component group and place the SVG object utilizing the ‘transform’ attribute.
<g class="draggable" id="example" transform="translate(70,90)">
Customize the rotodrag-js library with ‘data-dragstyle’ and ‘data-slip-radius’ attributes as follows:
<g class="draggable" id="example" transform="translate(70,90)" data-dragstyle="slippery" data-slip-radius="20" >
Rotate & Transform SVG Elements With One Finger, rotodrag-js Plugin/Github, javascript drag and drop connectors
See Demo And Download
Official Website(asgordon): Click Here
This superior jQuery/javascript plugin is developed by asgordon. For extra advanced usage, please go to the official website.
Be First to Comment