jquery-ui-draggable

问题 I am trying to drag an element without keeping the mouse button down. The behavior I would like is : I click on a draggable item Drag my item without keeping mouse left click down : just follow the mouse as a cursor I click on a droppable container to confirm and append my item I am able to simulate this behavior if I add an alert box durring the start event. start : function(){ alert('test') }, Here is the fiddle : http://jsfiddle.net/QvRjL/103/ How is it possible to code this behavior

问题 When dragging an object, the user can drag in the x and y axes. I want to constrain the draggability to only the x-axis. How should I go about doing this? Thank you! 回答1: Check out the axis option: "Constrains dragging to either the horizontal (x) or vertical (y) axis. Possible values: 'x', 'y'." Examples: // Initialize a draggable with the axis option specified. $( ".selector" ).draggable({ axis: 'x' }); // Get the axis option, after initialization. var axis = $('.selector').draggable(

问题 I'm using JQuery UI for drag and drop tree nodes and its working fine. I need to improvise it in terms of much more user interactive, When i drag any element it shows the same element name, you can see in the image (Test 3 I've dragged to down). But my requirement is when I drag any tree node it should show the image specified, instead of same text. Is it possible? My draggable function as follows, what changes i need to do to achieve the requirement. $("li a").draggable({ revert: "invalid",

问题 I am trying to add a class to the draggable event using jQuery UI. However the following code that I've written is not working as expected; $(function () { $('ul.sortable div.draggable').draggable({ start: function(event, ui) { ui.helper.addClass('move'); }, }); }); Essentially I am trying to add a drop shadow (using the move class) to the div.draggable. What am I doing wrong as the drag event works, but the drop shadow does not appear? Thanks in advance.. 回答1: From the jQuery UI Draggable

问题 Using jQuery Draggable How to restrict a draggable to be dragged only in one direction ? i.e either only top or only bottom when axis: 'y' and either only left or only right when axis: 'x' This means that if I want a draggable (with axis set to 'y') to be dragged only to bottom , then it should not be able to drag it to top i.e it should remain in its place when tried to drag towards top This is what I have tried but not working, i.e draggable is still getting dragged in upward direction $('.

问题 I am trying to allow dragging from a sortable list to a dynatree. My initial though was to specify something like this: $('#ews_pgs_clpbrd_items').sortable({ connectToDynatree: true }).disableSelection(); dynatree does not register the drag and drop events for the sortable items. so I tried $("#ews_pgs_clpbrd_items").sortable().disableSelection(); $("#ews_pgs_clpbrd_items li").draggable({ connectToDynatree: true, connectToSortable: "#ews_pgs_clpbrd_items" }); This allows the items in the

问题 I've created a "2d slider" in jQuery in which 2 parameters are manipulated simultaneously by dragging a "handle" within a bounding box. I've implemented this by nesting a "handle" div within a parent div, and using the jQuery UI plugin to facilitate the dragging behaviour. The html looks like: <div class="Slider2d" id="grid_spacing_both"> <div class="Slider2dHandle" id="grid_spacing_both_handle"></div> </div> The jQuery looks like: $(".Slider2dHandle").draggable({ containment: "parent",

问题 I have a div containing a few jquery draggables, however if at any point I remove one of these draggables from the page then this can move the rest of them as they are positioned with relative. Here is a fiddle showcasing this: http://jsfiddle.net/VolatileStorm/aNk6e/ My proposed solution is that the draggable should be using absolute as opposed to relative positioning, however I can't find a way to do this. Is there a way to do this, and if not, can anyone think of a way around it? (For

问题 The jQuery UI Draggable interaction has a nice property for setting the containment as the parent. $( ".selector" ).draggable({ containment: 'parent' }); I wish to set the containment as the parent's parent. There is no string value to accomplish this, as string the options are 'parent', 'document', 'window', [x1, y1, x2, y2] I could calculate x1,y1,x2,y2 of the parent's parent at page load and use those values to set boundaries for a container relative to the document. But the container

问题 Here, is my fiddle for jquery drag, drop and clone feature. Problem: My problem is: when ever I drop element, it is showing: position: {top: 0, left: 0} only for draggable, clone and droppable element. I have also written code for finding position using only draggable function and that is working fine. I want this behavior in draggable, droppable with clone feature Please visit JSFiddle fiddle full-screen output 回答1: Finally, resolved the problem. The problem was, I was using ui.draggable