Questions tagged [draggable]

An element capable of being dragged.

In computer science usually an element is draggable if can be picked using mouse (or another pointing device) and moved around on the screen (or another visualization device).

The term is usually used jointly with the term drop to indicate the sequence needed to pick an object, move it around and then release it in a new position to perform an action.

References:

3630 questions
187
votes
10 answers

Preventing an image from being draggable or selectable without using JS

Does anyone know of a way to make an image not draggable and not selectable -- at the same time -- in Firefox, without resorting to Javascript? Seems trivial, but here's the issue: Can be dragged and highlighted in Firefox: So we add this, but…
tmkly3
  • 3,131
  • 2
  • 18
  • 13
117
votes
7 answers

How can I make a jQuery UI 'draggable()' div draggable for touchscreen?

I have a jQuery UI draggable() that works in Firefox and Chrome. The user interface concept is basically click to create a "post-it" type item. Basically, I click or tap on div#everything (100% high and wide) that listens for clicks, and an input…
artlung
  • 33,305
  • 16
  • 69
  • 121
84
votes
10 answers

Determine what is being dragged from dragenter & dragover events

I'm trying to use the HTML5 draggable API (though I realize it has its problems). So far, the only showstopper I've encountered is that I can't figure out a way to determine what is being dragged when a dragover or dragenter event…
Trevor Burnham
  • 76,828
  • 33
  • 160
  • 196
80
votes
21 answers

jQuery draggable shows helper in wrong place after page scrolled

I'm using jQuery draggable and droppable for a work-planning system I'm developing. Users drag jobs to a different day or user, and then data is updated using an ajax call. Everything works fine, except when I scroll down the main page (Jobs appear…
Alex
  • 8,353
  • 9
  • 45
  • 56
69
votes
18 answers

jQuery UI - Draggable is not a function?

I've trying to use the draggable effect on some divs on a page, but whenever I load the page, I get the error message: Error: $(".draggable").draggable is not a function I've had a look around it seemed other people were having this problem as they…
Dan
  • 879
  • 2
  • 7
  • 9
65
votes
9 answers

Moveable/draggable

This is my updated and modified script, it works completely, except I would like to universalize it... observe the **** how can I make it so that I don't have to do function(e){BOX.Draggable.elemen = e.target || e.srcElement; elementDraggable(e);…
person0
  • 1,278
  • 2
  • 15
  • 20
64
votes
12 answers

Draggable div without jQuery UI

I'm trying to make a div draggable without using jQuery UI. However, I'm stuck with the code below. I understand that I should use the mouse position relative to the container div (in which the div will be dragged) and that I should set the div's…
holyredbeard
  • 19,619
  • 32
  • 105
  • 171
63
votes
4 answers

Precise Drag and Drop within a contenteditable

The Setup So, I have a contenteditable div -- I'm making a WYSIWYG editor: bold, italics, formatting, whatever, and most lately: inserting fancy images (in a fancy box, with a caption).
ChaseMoskal
  • 7,151
  • 5
  • 37
  • 50
58
votes
10 answers

make bootstrap twitter dialog modal draggable

I'm trying to make bootstrap twitter dialog modal draggable with this jquery plugin: http://threedubmedia.com/code/event/drag#demos but it doesn't work. var $div = $('html'); console.debug($('.drag')); $('#modalTest') .drag("start", function(ev,…
paganotti
  • 5,591
  • 8
  • 37
  • 49
56
votes
5 answers

jquery draggable: how to limit the draggable area?

I have a draggable object (div), and some droppable ones (table TD's). I want the user to drag my draggable object to one of those droppable TD's. I enable draggable and droppable this…
xus
  • 2,587
  • 8
  • 31
  • 44
53
votes
4 answers

How can i make a MatDialog draggable / Angular Material

Is it possible to make a Angular Material Dialog draggable? I installed angular2-draggable and can of course use the functionality on all other elements. But because the dialogs are dynamically created i can not use ngDraggable on a special element…
HansDampfHH
  • 575
  • 1
  • 4
  • 10
49
votes
8 answers

Retrieve latitude and longitude of a draggable pin via Google Maps API V3

I will explain. I managed to have a draggable pin on a map. I want to retrieve the coordinates of this point and put them into two fields: Latitude and Longitude. These coordinates will later be send to a SQL table via PHP. Here is an example of…
Macxim
  • 664
  • 1
  • 8
  • 14
48
votes
4 answers

HTML5, JavaScript: Drag and Drop File from External Window (Windows Explorer)

Can I kindly ask for a good working example of HTML5 File Drag and Drop implementation? The source code should work if drag and drop is performed from external application(Windows Explorer) to browser window. It should work on as many browsers as…
Bunkai.Satori
  • 4,698
  • 13
  • 49
  • 77
42
votes
3 answers

How to create a draggable legend in matplotlib?

I'm drawing a legend on an axes object in matplotlib but the default positioning which claims to place it in a smart place doesn't seem to work. Ideally, I'd like to have the legend be draggable by the user. How can this be done?
Adam Fraser
  • 6,255
  • 10
  • 42
  • 54
41
votes
10 answers

jQuery Drag And Drop Using Live Events

I have an application with a long list that changes frequently, and I need the items of that list to be draggable. I've been using the jQuery UI draggable plugin, but it is slow to add to 400+ list items, and has to be re-added every time new list…
devongovett
  • 4,850
  • 5
  • 34
  • 35
1
2 3
99 100