ngDraggable icon indicating copy to clipboard operation
ngDraggable copied to clipboard

Dragged object wrong offset after scroll

Open MaximeGuilloreau opened this issue 10 years ago • 6 comments

Hi,

We have a list of draggable objects displayed in a column. When we scroll and after that, start dragging one object, it is not anchored bellow the mouse pointer.

In fact it is displayed lower. It seems we have the same offset between the mouse point and the block as the page scrolled offset.

Thanks in advance

MaximeGuilloreau avatar Apr 23 '15 15:04 MaximeGuilloreau

take a look at the ngDragScroll directive

fatlinesofcode avatar Apr 23 '15 22:04 fatlinesofcode

Hi,

I work with @MaximeGuilloreau. We tried looking at this directive and functions onmove or onlongpress but we had a hard time understanding how it works.

After looking at other implementation examples on the web, we found one that fixes our problem. We removed all reference to ng-center-anchor and added a data-allow-transform="true" attribute. However, we don't understand why it fixes our problem.

For example, you have this in the code :

var allowTransform = angular.isDefined(attrs.allowTransform) ? scope.$eval(attrs.allowTransform) : true;

So it should be true per default no ?

Coming back to your directive ng-drag-scroll. Do we need to add it somewhere in our code ?

Thanks in advance

jbouzekri avatar Apr 24 '15 05:04 jbouzekri

By default element are dragged using css transformations. Setting allowTransform to false changes this to use fixed positioning with Top & Left.

There are some details on ngDragScroll here, https://github.com/fatlinesofcode/ngDraggable/pull/86

fatlinesofcode avatar Apr 24 '15 05:04 fatlinesofcode

@MaximeGuilloreau , are you seeing the issue when you manually scroll, or when you scroll when dragging an element?

steve-baer avatar Apr 24 '15 23:04 steve-baer

I will answer for @MaximeGuilloreau. In fact it is before draging an element. We have a right column with a list of blocks to drag. The columns is high so it goes out of the viewport. If we scrolled manually then started dragging an element, this element was bellow the mouse pointer with the offset equal to the amount we scrolled.

However, it was fixed after putting data-allow-transform="true" in our code. But as I said in my comment above, it should be true per default.

jbouzekri avatar Apr 25 '15 07:04 jbouzekri

I tried using the ng-drag-scroll directive but the offset is not updated. And my understanding is that this directive scroll automatically when we move near the border of the viewport. So it cannot be used for this issue.

jbouzekri avatar Jun 01 '15 21:06 jbouzekri