angular-drag-and-drop-lists icon indicating copy to clipboard operation
angular-drag-and-drop-lists copied to clipboard

Scroll or Mouse wheel not working using drag and drop

Open gurpreetkamboj21 opened this issue 10 years ago • 5 comments

I'm using drag and drop, If i have 100 items in drag and drop list and i want to move 75th no item on 10th location. But Firefox scroll or mouse wheel does not work.

gurpreetkamboj21 avatar Oct 21 '15 11:10 gurpreetkamboj21

i have the same issue... nvm i found a work around :)

the draggable elements are using the html5 draggable property

all you need to do is add the scroll, look at the solution posted by "user2568570", hope it helps http://stackoverflow.com/questions/18809678/make-html5-draggable-items-scroll-the-page

Hodor9898 avatar Nov 23 '15 12:11 Hodor9898

This is an issue with Firefox. There are other libraries out there that work around the issue.

On Mon, Nov 23, 2015, 7:41 AM Hodor9898 [email protected] wrote:

i have the same issue...

— Reply to this email directly or view it on GitHub https://github.com/marceljuenemann/angular-drag-and-drop-lists/issues/157#issuecomment-158924026 .

jjoekoullas avatar Nov 23 '15 13:11 jjoekoullas

The solution of Hodor9898 works, but for usability I want to use the wheel too. The problem is that the wheel event is not triggering while your dragging.

If you are not dragging, you can use the wheel while you have the mouse button clicked and wheel event is triggering.

Tested in Opera and Firefox.

cesarmm avatar Mar 11 '16 12:03 cesarmm

Maybe too late, but my solution was this:

            $("footer").bind("dragover", function(e){
	    	$(window).scrollTop($(window).scrollTop()+10);
	    });

	    $("#div_nav_header").bind("dragover", function(e){
	    	$(window).scrollTop($(window).scrollTop()-10);
	    });

replace footer and div_nav_header for whatever you want, but the idea is the same: Force the browser to scroll when you drag over the footer or the header (both can be invisible if you want to).

Tested in Vivaldi, Chrome and IE11.

Regards

McValls avatar Jun 07 '17 19:06 McValls

Maybe better don't prevent mousewheel event on drag* event? I have div with scrollbar and many divs inside first. They are also with scrollbars. And absent any scroll on drag item make big pain. Because I must move one item to another div which doesn't visible in the viewport.

am-kra4un avatar Aug 29 '17 13:08 am-kra4un