question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Add drag cursor on hover?

See original GitHub issue

By default a cursor should indicate item that an item is draggable and change on drag.

This turns out to be very tricky. The states that need to be supported:

Must:

  • draggble: cursor: -moz-grab; cursor: -webkit-grab; cursor: grab;
  • dragged cursor: -moz-grabbing; cursor: -webkit-grabing; cursor: grabing;

Nice to have:

  • copy: when item is moved into list where it can be copied, show copy cursor
  • not-allowed: show not allowed cursor when moving somewhere on a sortable where the item can not be dropped.

Maybe this helps:

Issue Analytics

  • State:open
  • Created 6 years ago
  • Comments:10 (3 by maintainers)

github_iconTop GitHub Comments

1reaction
joephuzcommented, Oct 22, 2019

@lukasoppermann Ill give it a shot if i have some time!

1reaction
lukasoppermanncommented, May 14, 2018

Hey, very neat, I think this issue should be enough as a reference. I would like this behaviour to be added as a default to the library, but of course that is a bit more complicated, as you can not rely on classes.

Read more comments on GitHub >

github_iconTop Results From Across the Web

CSS for grabbing cursors (drag & drop) - Stack Overflow
I have a JavaScript webapp where the user needs to grab the background to move the whole screen around. So I want the...
Read more >
How to Change Cursor on Hover in CSS - W3docs
To specify the cursor appearance, use the CSS cursor property, which is used to change the mouse cursor type on elements. It can...
Read more >
How to Change the Cursor into a Hand Pointer on Hover ...
Answer: Use the CSS cursor Property. You can simply use the CSS cursor property with the value pointer to change the cursor into...
Read more >
Grab & Drag - CodePen
Drag icon using :before and multiple text-shadows...
Read more >
cursor - CSS: Cascading Style Sheets - MDN Web Docs
Move over this element to see the cursor style. ... You can hover your mouse over the table rows to see the effect...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found