I'm using a draggable effect on a css div for a shopping cart (prototype+script.aculo.us). I want to insert a link into this div which allows the users to toggle between fixed and absolute positioning. Does script.aculo.us has any simple way of doing it? (So far i found nothing)
...
I'm trying to move a draggable element around in the DOM, but whenever I try replaceWith() or remove() or similar functions, its draggability is lost.
Is it possible to make an element not lose its draggability when moving it around in the DOM?
...
Hi all,
i have a problem in jquery drag n drop.
I have a "div a" and 'div c' i.e draggable n a 'div b' over which 'div a' and 'div c' are droppable.if div a is dropped over div c .How can i find that as div b is the superset of div c.
...
I have a standard div that is set to both drag & resize within it's parent. I need to be able to resize the div as it is dragged into it's parent. I only need this to happen when it's dragged vertically to the bottom, so I have it setup like this:
$("#draggable").draggable({
drag: function(event, ui) { AtBottom(); },
axis:'y', c...
I'm developing a simple WPF UI for image post-processing.
I'd like to create a draggable WPF control to be used on a Canvas which would look roughly like this:
Both end points ellipses would be draggable and the line joining them would follow as the end points move.
Now, I know how to implement this by simply adding these elements i...
How can I have two lists (div or table elements) in which I can drag & drop items from one to the other (I think jQuery droppable does this), but without actually removing it from the source list?
Example:
List1 List2
AAA 111
BBB 555
CCC 999
DDD 777
Now I'm dragging BBB from the left to the right between "55...
Hi,
I use draggable/droppable JQuery feature as follows
div.container {
height:400px;
}
<div class="container" id="source">
<div id="0">Item 0</div>
<div id="1">Item 1</div>
<div id="2">Item 2</div>
</div>
<div class="container" id="target"></div>
$("#source div").draggable({
helper:"clone",
revert:"inval...
i have a draggable div that has the overflow position to auto, so when the content is too big and i get a scroll bar,
since i haven't added a handle (i want the hole content of the div to drag it) when you use de scroll bar the div moves/draggs....
is there a way of excluding an element from the handle of a draggable div in jquery?
i...
$(".LWdrop").droppable({
accept: ".LW",
drop: function(event, ui){
ui.draggable.addClass("LWactive");
$(this).droppable('option', 'accept','');
$(this).css("background-color", "#444444");
},
out: function(event, ui){
$(this).droppable('option', 'accept', '.LW');
u...
When you are pretty far zoomed out on a google map, you can drag it enough so that the map ends and becomes a blank gray color. The map seems to repeat seemlessly on the horizontal axis, but not vertically.I'm wondering if there is a way to prevent the map from being dragged when it reaches that gray area. Any ideas?
...
I have a simple setup, a div with a list of items and a second div to add those items to. The second div is sortable, and css is set to overflow: scroll. When arranging the items in the sortable div, it scrolls as expected. When adding a new item to the sortable, it does not scroll. I want the same scrolling behavior, no matter where...
I'd like to implement a dragging feature where users can drag objects around the workspace. That of course is the easy bit. The hard bit is to try and make it a physically correct drag which incorporates rotation due to torque moments (imagine dragging a book around on a table using only one finger, how does it rotate as you drag?).
Doe...
If I have this markup:
<table id="sometable">
<tr>
<td class="x"><span>111</span></td>
<td>aaa</td>
</tr>
<tr>
<td class="x"><span>222</span></td>
<td>bbb</td>
</tr>
</table>
And this jQuery code:
$(".x span").draggable({ helper: 'clone', axis: 'y'});
When dragging the first column the cloned span is...
I have two elements:
1) a parent of fixed height, overflow:hidden
2) its child, of larger fixed height.
<style type="text/css">
.myList {list-style:none; margin:0px; padding:1px;}
.myList li{ height:50px; margin:4px; padding:2px;}
.dragPanel {height:230px; border:solid; overflow:hidden;}
</style>
<div class="dragPanel">...
Hello everyone!
I am wondering if there is a way to make the jQuery draggable to only drag straight up, down and left, right. I want to prevent the user from dragging a div diagonally. Using the grid option in the draggable UI is not possible in my situation.
http://jqueryui.com/demos/draggable/#constrain-movement
How is this possible...
Hello,
I've been using mootools for some time and trying jQuery for a week so this probably is a newbie question - though I've found nothing in the manuals.
In mootools, when you use the option clone in a sortables list it creates a clone of your image/object that helps you visualize where the image/object will be droppped - works gre...
I'm creating an interface to allow a user to zoom in on an image and drag the zoomed version around within a clipping mask div.
I have a div 200px by 200px that I set overflow: hidden on. Then I load a std img (<img src="etc">) into the div that is, say, 1000px by 1000px.
Then I use jQuery
$("#my-image").draggable({ containment: [-8...
Hello!
On my CMS I have a list of thumbnails (Sortable). The thumbnails work great and now I'm writing a plug-in to drag-them to a tinyMCE window.
As the tinyMCE window has an iFrame it doesn't work that well.
jQuery has an option for Draggables called iframeFix that works exactly as I need. However that list must be a Sortables. I'v...
I am not sure if this is a bug - but in this example there is no way to select the text underneath the elements that can be dragged.
Same issue with form elements.
http://jqueryui.com/demos/draggable/handle.html
Any ideas?
...
I have a droppable container with >1 draggables in it. I want to simply be able to see the position of each draggable every time any one of them is dragged. Sounds easy, but I'm having a tough time figuring it out. Here's what I have:
<script type="text/javascript">
$(function() {
$("#draggable").draggable({ containment: '#droppable' }...