Questions tagged [interactjs]

26 questions
2
votes
1 answer

Drag 'n Drop Events firing multiple times

I am working on a webapp with drag 'n drop functionality. Up to now I used basic HTML5 Dragging but now I switched to using the library interact.js. I don't know if my problem is specific to this library or of more general kind: Events when…
NotARobot
  • 195
  • 1
  • 13
1
vote
1 answer

InteractJs - Dynamic Snapping of draggable items to guideline in parent div

In the below fiddle I have interact Js to snap the children element to a certain point. But I am having trouble snapping all sides of the blue div to snap to center and x & y axis of the parent div. JsFiddle: https://jsfiddle.net/n3wLb5vp/1/ Below…
toddash
  • 127
  • 14
1
vote
1 answer

How to move elements from one div to another without resetting to original position? (interact.js)

I am using interact.js and am trying to separate the elements into two divs (toolbox and matrix to be solved). However when I attempt to implement this, if the elements and the matrix are not in the same div then the elements go back to the original…
1
vote
0 answers

interactjs drag stops after few events

I just had a heavy problems with a vue cli project with interactjs the latest version is installed "interactjs": "^ 1.10.3", I use in vue https://github.com/kimuraz/vue-interact Now I have the following problem, in a dummy project I have a component…
bluelemonade
  • 549
  • 6
  • 17
1
vote
1 answer

using the injectable service in end callback function with interactJS

I'm using interactJS with angular to make it possible for the user to perform a drag and drop of the elements with the class 'draggable'. Everything worked fine until I needed to use the injected service of the component in in the callback function…
1
vote
1 answer

Can't drag and drop to another div using interact.js

Html/css newbie here, I am using interact.js to attain a certain UI where I can drop items from a list into a drop zone. The problem is my list can grow very long and I need to add scroll to the list, and when I try to do so I have create a 'div'…
Yudhishthir Singh
  • 1,842
  • 1
  • 10
  • 27
1
vote
0 answers

Interact.js clone on drag (in vue component)

I am building a drag'n drop application with vue, so there are multiple boards and some cards which can be dragged to these boards. I included interact.js for dragging which works fine but now I am unsure how to implement a clone on drag. Right now…
NotARobot
  • 195
  • 1
  • 13
0
votes
0 answers

pinch problem in interactjs when touching the background

i have a problem with interactjs. somehow I don't get the ignorefrom and allowFrom properties with the gestures. the left card can be rotated, the right one cannot, just a small difference with the allowFrom. why? but it is even more problematic if…
bluelemonade
  • 549
  • 6
  • 17
0
votes
0 answers

Dropzone script (limited to dropzone and initial pos when dropped)

Basically what I need is a dropzone script, where the items that I can drag are only dropable in dropzone, if not they need to return to initial position. If I drop an item into dropzone and then remove it, it should go back to starting position.…
0
votes
0 answers

Interact.js dropzone event doesn't trigger

I want to use interact js to drag and drop divs and drop these into a dropzone I managed to get the drag element working, but the drop zone events seems odd : only the 'ondrop' listener seems to trigger. I got: interact('.drop_zone').dropzone({ //…
Felox
  • 285
  • 2
  • 6
  • 15
0
votes
0 answers

interact.js: Get position of rectangle instead of mouse

I'm using interact.js with its draggable function inside a div container and restricting the interaction. The box I'm dragging around is .interact-box.
Kheber
  • 109
  • 1
  • 7
0
votes
0 answers

leaflet map drag direction problem in rotated div

I have a leaflet map that I can rotate freely within a div via interactjs. Now the following happens, when I have rotated the map by 180 ° the drag movements on the map are exactly opposite. Is there any way to get around that?
bluelemonade
  • 549
  • 6
  • 17
0
votes
0 answers

interactjs pass dragevent to lower zIndex

I have an area within an interactjs draggable element that is not draggable. I have defined this area with ignorefrom, works well so far. interact ('#' + self.idName) .draggable ({ ignoreFrom: '.nodrag1, .nodrag2, onstart:…
bluelemonade
  • 549
  • 6
  • 17
0
votes
0 answers

Interactjs issues when i try to invert an image

I have 3 buttons, one to rotate, another to resize and the last to drag. Everything for one image. Now with this image what I want is to design another button so that it inverts a mirror effect, it works well when I give it using this…
eddyhg
  • 13
  • 3
0
votes
0 answers

Get closest edge of a stationary element relative to a dragged onto object

I am creating a drag and drop planner with angular and interactjs. I am able to recognize collisions between two draggable items and i would like to snap the item dragged onto to the closest edge of the stationary item. How do I check what edge of…
Lars A.
  • 3
  • 2
1
2