3,661 questions
0
votes
1
answer
30
views
Element gets white gradient transparent during drag-bug behaviour
I’m working on an Angular 15 application that uses PrimeNG v15 and Angular CDK for drag-and-drop functionality. When I drag a row element, the drag preview shows a white gradient overlay, making the ...
0
votes
0
answers
31
views
Create draggable card using Dnd kit without knowing inital x,y position
I want to create multiple draggable components that can be moved everywhere using react's Dndkit.
However I am not manually setting the position of component(only setting height and width).
I cannot ...
- 27
0
votes
2
answers
100
views
Click doesn't respond on iOS
The click event doesn't fire on iOS with the following JavaScript. It works fine on Windows. Why is this happening? Is there a workaround?
const pin = new google.maps.marker.PinElement({
scale: 1....
- 11
-1
votes
1
answer
70
views
Google Chrome is dragging unselectable text?
This is a pretty common problem, and I wanted to know if there was a way to disable it using CSS or something.
So I have some text I made unselectable with:
user-select: none;
And that does what it's ...
- 1
0
votes
0
answers
42
views
DND-Kit draggable card with a isEditing state that exposes input
My desire is to have a draggable card that displays information, and if the user clicks on the card, it will expose inputs to change that information, all while being able to dnd that card.
My current ...
0
votes
0
answers
74
views
gridstack draggable not working on dynamic widget
I am using Gridstack in Angular.
My issue is that when I add a static widget to the Gridstack layout, the draggable.handle option works as expected.
However, when I dynamically add another widget, the ...
- 41
2
votes
2
answers
139
views
mat-dialog moves out of the screen when the dialog is dragged and resized [closed]
Is there a way to prevent the dialog from moving out of the screen/window when it is resized? I have set minimum and maximum height and width for the Mat dialog, but when I drag the dialog toward the ...
- 21
1
vote
1
answer
59
views
MouseMove event unpredicted behaviour when dragging cards
Hi I'm trying to imitate swiper.js effect, the drag effect where you can drag a card
and on dragging it will rotate and move according to the mouse movement
but I have a problem with my implementation ...
- 21
0
votes
1
answer
32
views
Make a draggable box inside scaled graphicsLayer modifier
I'm trying to make a draggable box inside a scaled (via .graphicsLayer modifier) Box.
Here is my code for the scalable container:
@Composable
private fun DraggablePlan(
modifier: Modifier = ...
- 11
0
votes
0
answers
67
views
Two widgets swapping places on drag and drop in Flutter
I am making a puzzle with hexagonal tiles that the user can rotate and reorder to reach the solution. I would like the tile that is dragged and dropped and the tile that is originally in the dropping ...
0
votes
1
answer
64
views
Setting dynamically created QML rectangle's drag.target property via JavaScript
I have dynamically created some QML rectangles on a Canvas. I wish to toggle whether the rectangles can be dragged around or not via the drag.target property, which is declared upon creation inside ...
- 15
1
vote
1
answer
42
views
how to stop mouse offset when clicking a draggable div? (jquery)
$(document).ready(function() { $(".drag").draggable(); });
this is the code for my draggable div, I am having an issue where the mouse snaps diagonally about half the div height when ...
- 11
0
votes
0
answers
56
views
How to set Bounds such that the draggable element does not breach boundary - using react-moveable
I am using a SVG image as a background , then adding other SVG Icons over the background, to set the position on the background (Resize and Rotate).
Current implementation does not cross the boundary ...
- 19
0
votes
0
answers
61
views
how can I integrate draggable and animatedList together?
My goal is to make the Floating Action Buttons (FABs) animate smoothly to fill the empty space when I pick one up using Draggable. However, I haven’t been able to achieve this.
I want to create an ...
- 1
4
votes
0
answers
140
views
How to reliably detect when SwiftUI .onDrag is canceled / has ended
I would like to use .onDrag and .onDrop to handle reordering of items in a LazyVGrid (.draggeble should not be used because it automatically adds a + icon).
While I found several tutorials dealing ...
- 19k
0
votes
0
answers
42
views
Draggable widget does not work in accessibility mode
I am developing a simple puzzle app in Flutter. I am using the draggable widget. Normally my code works perfectly (drag and drop is ok). But when accessibility mode is on (talkback) the draggable ...
- 1
0
votes
0
answers
45
views
Is there a way to remove "+" badge over .draggable preview
I'm using .draggable and .dropDestination in my app, and I'm curious if it's possible to remove the "+" badge over DnD previews. I can't find anything on the web regarding that. Thank you.
...
0
votes
1
answer
40
views
Draggable slider for touch devices
var reachedLast = false;
var reachedFirst = false;
jQuery("#gbar").draggable({
axis: "x",
containment: "parent",
drag: function (event, ui) {
var ...
0
votes
0
answers
31
views
Is there any way to Drag and Reorder Card widget between multiple Grid Views in Flutter
I want to create a screen where there are multiple Grid Views inside a Column or ListView and I want the following:
Able to drag and reorder cards in a GridView itself.
Able to drag and drop cards ...
0
votes
0
answers
81
views
Using e.clientX and e.clientY for ordering draggable elements horizontally and vertically in a single DIV container with overflow in vanilla JS
I have been spending the entire evening trying to implement e.clientX as well as e.clientY into this "drag n' drop" code.
My draggable elements append horizontally in a high container (...
0
votes
0
answers
51
views
Flutter: Finding the center position of a Widget
The goal is to highlight a Container's Top or Bottom border depending on when a Draggable hovers over the Container. If the hovered Widget is within the top-half of the DragTarget, then highlight the ...
0
votes
1
answer
19
views
Highcharts draggable grouped errorbars
I am trying to set up a Highcharts demo where errorbars are used alone (without another data series). I'd like the errorbars to be draggable in the Y axis and grouped so that if you drag one errorbar ...
0
votes
1
answer
54
views
Making multiple elements draggable to any location the user wants on the screen and having them stay there
I've got 9 DIV elements on a page all with the class cell, and this is the code I have so far... it was working to drag them anywhere on the screen, but I screwed it up somehow because it's not ...
1
vote
1
answer
230
views
Combining reorderable widgets (in a Wrap) with widgets in another container to achieve multiple drag-and-drop behaviors
I want to have two containers in a Row that each have their own lists of Card widgets.
The first (left) container is a library of Cards which is a Wrap to make the cards flow horizontally. The Cards ...
- 2,516
0
votes
1
answer
106
views
Get mouse position when dragging a Draggable Container over a DragTarget?
I have a Container with a Draggable widget. And another Container() as DragTarget.
Dragging and dropping in this area is working very well.
But where I drop it is also important. If I drop on the ...
- 391
0
votes
0
answers
89
views
Getting Vue draggable is not defined error in mobile browser
Using vue3 draggable - working fine in laptop browser but where as in mobile browser, getting vue draggable is not defined error.
const mainSortBundleApp = createApp(sortBundleApp);
mainSortBundleApp....
- 1
0
votes
0
answers
49
views
Two DragTarget side by side loose the onLeave Event
I have this code below for two dragTargets side by side.
return DragTarget(
builder: (
BuildContext context,
List accepted,
List rejected,
) {
return Container(
height: size.height,
width: size.width,
...
- 391
0
votes
0
answers
36
views
react-draggable issue on mobile devices
I have an issue with react-draggable library, when on mobile or tablet devices onClick from children are not propagated. Anyone knows which might be the reason?
<Draggable onStart={handleDragStart} ...
- 165
0
votes
0
answers
60
views
How to create two widgets droppable in each other?
The idea is simple, imagine a Row with only two Containers side by side. One red and another blue.
If we wrap each Container with a Draggable we can now drag these containers.
But I want also to ...
- 391
1
vote
1
answer
504
views
SwiftUI: How to make .draggable() respond immediately without delay?
In my SwiftUI application, the drag and drop feature is a core functionality, especially on one specific screen where it's used frequently.
By default, there's a small delay before the drag starts (a ...
- 27
0
votes
1
answer
52
views
How to use both sortable and draggable in jQuery UI simultaneously
html:
<div class="item-list" id="list">
<div class="draggable" data-index="0" draggable="true">Draggable1</div>
<div class=&...
- 1
4
votes
1
answer
2k
views
How to make a composable draggable using AnchoredDraggableState?
I'm trying to create an anchored draggable and it just doesn't work. Here is my code:
import android.annotation.SuppressLint
import android.os.Bundle
import android.util.Log
import androidx.activity....
- 1,717
1
vote
1
answer
79
views
Unary relationship with LeaderLine
I am working on an application to graphically represent Java classes in Class Diagram form.
PlainDraggable and LeaderLine made this task much easier.
However, I tried to create a unary / recursive ...
0
votes
1
answer
179
views
How to drag a clone with Svelte5 and interact.js
I'm using interact.js and Svelte 5 (version 5.0.0-next.200) to drag an element which initially sits inside a scrollable div and must be dropped outside of that div. To make this work I need to clone ...
- 117
0
votes
1
answer
71
views
Handle Resize HTML Frame Element
I'm developing an Angular component that allows users to resize a div containing an iframe by dragging a resize handle. However, I've encountered an issue: the resizing stops when the mouse moves over ...
- 5
-1
votes
1
answer
427
views
How to disabled dragging when resizing
I am using dndkit and re resizable. When i resizing, the component is still moving as in the here https://codesandbox.io/p/sandbox/dnd-kit-resize-24tcrh?file=%2Fsrc%2FDraggable.js
Here is my code.
...
- 529
0
votes
1
answer
60
views
Select text in absolute element where parent is draggable table cell
How can I select text on #text element?
SelTd is draggable and has onDragStart event.
#textparent is relative, #text is absolute
the goal - mouse selection of the text in #text and copy it
If I ...
- 598
0
votes
1
answer
41
views
Draggable line series gives a TypeError: Cannot read properties of undefined (reading 'chart')
I'm currently using
when I try to click and drag the point of the line it gives
Draggable line series gives a TypeError: Cannot read properties of undefined (reading 'chart')
My settings in the series ...
0
votes
2
answers
697
views
Pine Script: draw horizontal line from inputs and change line from chart by dragging from single drag point
In a Pine Script indicator I want to use a horizontal line in calculating a setup. This horizontal line changes from time to time and needs to be placed and then repositioned after every setup by the ...
0
votes
0
answers
82
views
How to make slider draggable in vanilla js
so the thing is that I have slider in which each card has link over it and when I try to do mousedown event on the whole element if that mouse is on the card it is perceived as click.
<div class=&...
0
votes
0
answers
49
views
How can I constrain a draggable SwiftUI element along an arc - without it hopping from one side to the other?
I'm attempting to have a circle that is draggable along an arc (between two arbitrary angles of a circle - the ones I've chosen randomly are between 13 degrees and 272 degrees. I want this to work ...
- 4,594
0
votes
1
answer
290
views
Angular Drag & Drop with nested section and subsection
I am trying to implement a drag-and-drop feature in my Angular 14 Application where I have nested sections and subsections. I want to move each section up or down and subsections will be moved between ...
- 171
1
vote
0
answers
108
views
Implement drag and drop functionality in recursive components
I'm trying to implement drag and drop functionality between two JSONs to map the keys of one JSON to another. I created the JsonViewerComponent that accepts JSON data as input and displays it using ...
- 11
0
votes
1
answer
30
views
Kivy - How can I modify example for using ScrollView + GridLayout (Kivy-Garden Draggable)?
This Kivy - Draggable example works great:
from kivy.properties import ObjectProperty
from kivy.app import App
from kivy.lang import Builder
from kivy.uix.label import Label
from kivy.uix.floatlayout ...
- 408
1
vote
0
answers
75
views
How to click an item to select it for dragging?
When using React Draggable, normally you click and hold down the button to select and drag an item with the mouse. Is there a way to just click an item and release the mouse button, and that item ...
- 11
1
vote
0
answers
127
views
React Draggable: Click and release to drag?
When using React Draggable, normally you click and hold down the button to select and drag an item with the mouse. Is there a way to just click an item and release the mouse button, and that item ...
- 33
1
vote
2
answers
110
views
Is it possible to add an eventListener to a custom title bar used for dragging the window in a frameless window?
Added a custom title bar to a frameless window in order to make the window draggable. The title bar shows, but eventListener won't fire:
main.js:
const createWindow = () => {
const win = new ...
- 37
1
vote
0
answers
224
views
Draggable items break styles on dragging
I'm creating a sequence quiz and chose @hello-pangea/dnd package (which is rewritten react-beautiful-dnd and I succeeded to create a simple component but I faced a problem that when I grab draggable ...
- 561
0
votes
0
answers
39
views
Adding style property to individual class elements on click, IF their data is modified
I'm trying to make a browser dress up game with separate tabs for draggable items (so tops, bottoms, etc). This is the JavaScript code for how the tabs function.
function openTab(event, Category) {
...
0
votes
1
answer
195
views
Dragging with onMove is not working when LongPressGesture is on view
I want to achieve behavior similar to the Apple Podcast app on the queue screen in iOS. Specifically, I need to:
Display a context menu after a long press on every row, except for the view with the ...