draggy-divs is a javascript file that makes your html elements draggable, minimizeable, exitable, incorrigible, etc.
you can blame me, jenn, and view the source on glitch!
import draggydivs.js
onto the html file containing the divs you want to make draggable. for example, if you want to add it to an html file in the same folder you put draggydivs.js
, you'd add this to your html:
<script src="draggydivs.js"></script>
to turn a div into a draggydiv, give it a class draggydiv
and a unique title. inside this div you need to have a button of class draggydivs-drag
, which is what the user can click to drag the div around.
if you want the draggydiv to be minimizeable (optional!), you also need a button of class draggydivs-minimize
inside of it. and somewhere you'll need to have an ol
or ul
element with the class draggydivs-minimized
, which is where the draggydivs will be minimized to as links of the text you gave in the draggydiv's unique title.
<ul id="draggydivs-minimize"><ul>
<div class="draggydiv" title="A Unique Title You'll See When This Div is Minimized">
<button class="draggydivs-drag">DRAG</button>
<button class="draggydivs-minimize">MINIMIZE</button>
<p>
Just some text :)
</p>
</div>
by the way, draggydivs.js only adds position styling to the elements, anything thing else you need is on you my friend!