jquery-ui-draggable

Combining jQuery Mobile taphold and jQuery UI draggable

由 大憨熊 提交于 2019-12-21 12:37:41
问题 I'm working on a mobile application where I'm trying to combine jQuery UI's draggable functionality with jQuery Mobile's taphold event. The idea is that an element becomes draggable when a taphold is executed. Draggable is being initialized on elements in the following code: $('div.rect', '#outerBox').draggable({ containment: "parent", grid: [50, 50], disabled: true, stop: function(event, ui) { $(this).draggable('disable'); $(this).removeClass('highlighted'); } }); As you can see the

jQuery Dragging With Collision Detection

由 蹲街弑〆低调 提交于 2019-12-21 12:28:27
问题 I have the following HTML: <div class="list" id="list"> <div class="item" id="i1">Item 1</div> <div class="item" id="i2">Item 2</div> <div class="item" id="i3">Item 3</div> </div> <div class="timeline" id="timeline"> </div> What I want to be able to do, with jQuery, is: Be able to drag .item s from the #list into the #timeline .item s can be dropped into the timeline as many times as required, eg. there could be 4 of item #i1 in the timeline. .item s in the timeline must not overlap each

jQueryUI draggable + sortable bug (Cannot read property 'options' of undefined)

由 别等时光非礼了梦想. 提交于 2019-12-21 09:02:07
问题 My question seems to resemble this question: dragging from a sortable list to a drag and drop plugin But since there is no answer given to that one i was wondering if anybody could / would be able to figure it out with me. The issue i am having is that i create a draggable div and append this into a div that is made sortable. When i specify any arguments like so: $(el).sortable({ ... arguments ... }); It causes an error when element is dropped see below, when left empty it strangely works

Disabling jQuery drag when scrolling contents of draggable item

由 微笑、不失礼 提交于 2019-12-21 02:01:35
问题 I don't normally make this sort of question / answer, but figured I'd do so, since I've seen this question asked 20+ times, and not a single answer actually works. In short, the problem is that if you have scrollable content ( overflow: auto; anywhere inside of a draggable jQuery item, when you click and drag the scrollbar's the parent draggable container drags along with it. So, I spent some time working up a solution. Here's an example of some html that would present this problem: <div

Disabling jQuery drag when scrolling contents of draggable item

由 人盡茶涼 提交于 2019-12-21 02:01:19
问题 I don't normally make this sort of question / answer, but figured I'd do so, since I've seen this question asked 20+ times, and not a single answer actually works. In short, the problem is that if you have scrollable content ( overflow: auto; anywhere inside of a draggable jQuery item, when you click and drag the scrollbar's the parent draggable container drags along with it. So, I spent some time working up a solution. Here's an example of some html that would present this problem: <div

jQuery Draggable - Start dragging element by clicking on it, without holding the mouse

由 孤人 提交于 2019-12-20 07:27:55
问题 Consider a basic jQuery Draggable element. Is there any method to start dragging the element with a single mouse click? (ie, when the element is clicked, it enters a drag state, and starts following the mouse, when it is clicked again, it gets dropped where it is) If this isn't achievable with jQuery, is it achievable with any other third party dragging library? 回答1: You can do this, in a sort of hack method, by triggering the mousedown and mouseup for draggable on click event. Reference: How

Different behaviors while using localhost and server name

由 烈酒焚心 提交于 2019-12-20 05:54:35
问题 I wanted to drag an image around inside a div, which I did using the jQuery UI draggable function. HTML: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script src="jQuery/jquery-1.8.3.min.js" type="text/javascript"></script> <script src="jQuery/jquery-ui-1.9.2.custom.min.js" type="text/javascript"></script> <script> $(document).ready(function () { $('#dragme').draggable(); }); </script> </head> <body> <div id="container" style="width:300px;height:300px;overflow:hidden

Offset issues with jQuery Draggable into an iFrame based Sortable

由 梦想与她 提交于 2019-12-20 03:55:10
问题 I'm having quite a bit of trouble resolving problems with offsets related to draggable elements being dropped into a sortable area within an iFrame. The following leaned-down example to demonstrates the problem here. Make sure to keep your window fairly narrow, as otherwise it's very difficult to drop the elements into the iFrame at all. It should be pretty obvious that you cannot drag the item and drop it in the designated place, instead you must drag about 350 pixels to the right of the

JqueryUI Drag: Cursor not at the same position as draggable element

由 ＊爱你＆永不变心＊ 提交于 2019-12-20 02:32:08
问题 I am using the latest version of JQuery and JQuery UI to understand drag and drop features. I am facing a minor problem - mostly due to mouse drag. As you can see that I am creating stacks with some items in it. Now if these stacks are just inside body - I mean div.allstacks is in body there is no problem. But as soon as I put all these stacks inside a div#left-panel, the problem of cursor losing focus starts. This means now when I drag an item, after horizontal scroll - My mouse cursor is

JqueryUI Drag: Cursor not at the same position as draggable element

由 ╄→гoц情女王★ 提交于 2019-12-20 02:32:02
问题 I am using the latest version of JQuery and JQuery UI to understand drag and drop features. I am facing a minor problem - mostly due to mouse drag. As you can see that I am creating stacks with some items in it. Now if these stacks are just inside body - I mean div.allstacks is in body there is no problem. But as soon as I put all these stacks inside a div#left-panel, the problem of cursor losing focus starts. This means now when I drag an item, after horizontal scroll - My mouse cursor is
订阅 jquery-ui-draggable