|
@@ -9,49 +9,6 @@
|
|
<link type="text/css" rel="stylesheet" href="stylesheets/stylesheet.css">
|
|
<link type="text/css" rel="stylesheet" href="stylesheets/stylesheet.css">
|
|
<link type="text/css" rel="stylesheet" href="converse.css">
|
|
<link type="text/css" rel="stylesheet" href="converse.css">
|
|
<script src="components/jquery/jquery.min.js"></script>
|
|
<script src="components/jquery/jquery.min.js"></script>
|
|
- <script type="text/javascript" src="src/dragresize.js"></script>
|
|
|
|
- <script type="text/javascript">
|
|
|
|
- $(document).ready(function () {
|
|
|
|
- //<![CDATA[
|
|
|
|
- // Using DragResize is simple!
|
|
|
|
- // You first declare a new DragResize() object, passing its own name and an object
|
|
|
|
- // whose keys constitute optional parameters/settings:
|
|
|
|
- var dragresize = new DragResize('dragresize', {
|
|
|
|
- minWidth: 200,
|
|
|
|
- minHeight: 250,
|
|
|
|
- minLeft: 20,
|
|
|
|
- minTop: 20,
|
|
|
|
- maxLeft: 0,
|
|
|
|
- maxTop: 600,
|
|
|
|
- handles: ['tm'],
|
|
|
|
- });
|
|
|
|
-
|
|
|
|
- // Next, you must define isElement. These are passed a given DOM element, and must
|
|
|
|
- // "return true" if the element in question is a draggable element.
|
|
|
|
- // Here, I'm checking for the CSS classname
|
|
|
|
- // of the elements, but you have have any combination of conditions you like:
|
|
|
|
- dragresize.isElement = function(elm) {
|
|
|
|
- if (elm.className && elm.className.indexOf('box-flyout') > -1) return true;
|
|
|
|
- };
|
|
|
|
-
|
|
|
|
- // You can define optional functions that are called as elements are dragged/resized.
|
|
|
|
- // Some are passed true if the source event was a resize, or false if it's a drag.
|
|
|
|
- // The focus/blur events are called as handles are added/removed from an object,
|
|
|
|
- // and the others are called as users drag, move and release the object's handles.
|
|
|
|
- // You might use these to examine the properties of the DragResize object to sync
|
|
|
|
- // other page elements, etc.
|
|
|
|
- dragresize.ondragfocus = function() { };
|
|
|
|
- dragresize.ondragstart = function(isResize) { };
|
|
|
|
- dragresize.ondragmove = function(isResize) { };
|
|
|
|
- dragresize.ondragend = function(isResize) { };
|
|
|
|
- dragresize.ondragblur = function() { };
|
|
|
|
-
|
|
|
|
- // Finally, you must apply() your DragResize object to a DOM node; all children of this
|
|
|
|
- // node will then be made draggable. Here, I'm applying to the entire document.
|
|
|
|
- dragresize.apply(document);
|
|
|
|
- //]]>
|
|
|
|
- });
|
|
|
|
- </script>
|
|
|
|
</head>
|
|
</head>
|
|
<body>
|
|
<body>
|
|
<!-- HEADER -->
|
|
<!-- HEADER -->
|