Home/ Questions/Q 8154385
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-06T16:19:50+00:00

When dragging something over a contenteditable area in Chrome, to be able to catch

  • 0

When dragging something over a contenteditable area in Chrome, to be able to catch the ‘drop’ event, one needs to call e.preventDefault(); on every ‘dragover’ event.

This hides the caret, which tells you where you are going to drop. This can be circumvented by manually updating the caret position via document.caretRangeFromPoint().

This works perfectly unless the window is inactive – then the caret is invisible.

Fiddle: http://jsfiddle.net/zupa/mezAm/

Is there a way to make it visible without using a helper?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    It turns out you don’t HAVE TO call e.preventDefault() in the dragover event, which leaves you with the cursor shown even if the window is inactive. (So the default browser behaviour is to show the drop caret.) All the tutorials state that you MUST call it to be able to catch the drop event. I believe you only need to return false.

    I have only tested that with Firefox 13.0.1 and Chrome 19.0.1084.56 (Other browsers have not yet implemented the drop event as per now.)

    • 0