Questions tagged [jquery-ui-draggable]

The jQuery UI Draggable plugin makes selected elements draggable with mouse movement.

The Draggable plugin makes the selected elements draggable with mouse movement.

Enable draggable functionality on any DOM element. Move the draggable object by clicking on it with the mouse and dragging it anywhere within the viewport.

Best part is that it is very easy to use. See this example:

<script>
    $(function() {
        $( "#draggable" ).draggable();
    });
</script>

For more information visit- jQuery UI - Draggable Demos and the API Documentation


Related Tags

1817 questions
0
votes
0 answers

Problems with drag and drop in jQuery UI

I have a couple of problems in jQuery UI. My webpage is divided into columns and I want to drag and drop tickets between columns. My HTML of tickets is:
0
votes
2 answers

jquery ui draggable with iframe wrong droppable position handle

I'm having an issue with jquery ui drag/drop. I need to drag element into an iframe which contains droppable area inside. When I drag item on the left side and drop to iframe, it didnt work as I expected. That looks like exactly this…
anhnt
  • 729
  • 1
  • 10
  • 18
0
votes
1 answer

How to drag a div within a div?

I want to add some div using drag and drop mechanism. I have a main div in which I add some other: When I drag div texted "HI" into below div, I append two other divs called Drag and Drop into the main div. Now what I want is to have the ability to…
Sumit patel
  • 3,807
  • 9
  • 34
  • 61
0
votes
0 answers

JQuery, how to trigger different drop event depending on which draggable

sorry if this question has already been answered but I have been looking for 2 days. I have multiple draggable elements and one droppable and would like to call a different drop event based on which draggable was dropped. Thanks. $(function()…
0
votes
1 answer

Drop position on a Jquery Draggable and Droppable

I have a problem with position of droped elements fron a dragable list. $(document).ready(function() { $('.fw-sidebar li').draggable({ cursor: "crosshair", revert: "invalid" }); function enableDraggable( el ){ $(…
oriceon
  • 359
  • 2
  • 6
  • 17
0
votes
1 answer

How to find previously dropped value from droppable div

I am working on dynamic formula generator using jquery drag and drop functionlaity What i have done so far is I have two 2 list
0
votes
1 answer

Draggable jquery object not responding to .click() on the dynamically created object

I am creating a draggable jquery object which needs to be first dragged and moved (copied to main container) and then clicked to be opened as a modal window with further options. I am not able to use .click() on the dynamically created object which…
0
votes
2 answers

jQuery UI draggable with css transition

I'm trying to have jQueryUI's draggable on my element: html:
js: $('.draggable').draggable(); Until now everything works ok, but when I add css material design styles: .draggable { position: absolute; width:…
0
votes
1 answer

Draggable jQuery UI doesn't fire CSS :hover state

Last edit: I've found this question. It looks to be a Chrome issue. I'm trying to drag a jQuery UI draggable element over an element which on CSS :hover bring up (z-index based) some of its childrens. I need that those childrens to accept my…
SYNCRo
  • 450
  • 5
  • 21
0
votes
1 answer

Score if drag&drop to the right category and make img disappear Drag&drop Jquery game

I'm very new to j Query UI. I was trying to design a drag&drop game. I looked into lots of answers in stack overflow but not getting very similar examples(or maybe I couldn't figure out). Basically, I tried to do a recycling game where you can drag…
Candtiimer
  • 13
  • 4
0
votes
1 answer

Parent div does not scroll on dragging a child inside of it

I have a parent div with many child divs. I want when a child div is dragged inside the parent div, then the parent div to scroll. When the parent div is the body, it works. But I want it to work with my own parent "content" div. Here is a js…
Petar Minchev
  • 46,889
  • 11
  • 103
  • 119
0
votes
1 answer

Jquery UI Selectable - Selecting multiple elements

I'm trying to implement a function to select multiple elements on my application here, but since I'm new to front end development I'm having some trouble controlling JavaScript's events and CSS. I found this post so I'm using It as my guide. Before…
0
votes
1 answer

Cursor is off the sorted item of jquery-ui-draggable when its parent is hidden out of screen during sort

Demo In the demo, the sortable items are in container .area which has a fixed position. When items being sorted and dragged into another container, I want .area to move out of the screen by using transform: translate(0,0). But the problem is that…
RedGiant
  • 4,444
  • 11
  • 59
  • 146
0
votes
1 answer

How to make draggable element as revertable when that element is appended to the list afterwords and element is generating dynamic inline style tag

I know there are no. of questions related to this on stackoverflow one of them as How to make dynamically added list elements draggable in jQuery? But I am trying something different. I am adding my list elements at the time of page loads. As like…
Laxminarayan
  • 188
  • 2
  • 16
0
votes
1 answer

Fabric.js Images blurry

I am using Fabric.js and jQuery UI for a drag and drop scene creator. When I drag and drop an image into the canvas the image becomes blurry/pixelated and appears to be zoomed in. I've been searching Stackoverflow and Google forever and can't find…
Ryan
  • 122
  • 1
  • 13