An Example of a CSS Code with the Dragover Class in CSS

Instead of relying on TypeScript, consider using styles as an alternative, such as providing styles for it. The DragDropConfig class contains a comprehensive list of classes. By using jQuery / JavaScript, we have the ability to add or remove classes.

Solution 1:

To receive the emitted event, it is necessary to subscribe to the event that is being emitted by



For example:

In the section labeled


, you have the freedom to do anything you desire.

Additionally, you have the option to utilize something similar to this without the need for any additional methods.

Solution 2:

When a draggable is placed over the dnd-droppable element, it will be assigned the CSS class


. Instead of using TypeScript, you can explore styling options for the dnd-droppable element.

/* Utilising SCSS on this example */
.my-droppable {
    border: 1px solid #000;
    &.dnd-drag-over {
      /* Changes the border color while a draggable hovers it */
      border-color: #ccc;

The DragDropConfig class contains the comprehensive list of classes.

Frequently Asked Questions