hold

Triggered only when holdToDrag is set to true. Fired before the dragStart event. The hold event represents a jQuery mousedown event and contains all the event data of the jQuery Event Object.

Example - hold to drag

<div id="draggable"></div>

<script>
  $("#draggable").kendoDraggable({
    holdToDrag: true,
    hold: function(e) {
        $("#draggable").css("background", "red");
    },
    hint: function(element) {
      var hintElement = $("<div id='hint'></div>");
      hintElement.css({
        "background-image": "url('https://demos.telerik.com/kendo-ui/content/web/combobox/tShirt.png')",
        "width": "248px",
        "height": "289px"
      });
      return hintElement;
    }
  });
</script>

<style>
  #draggable {
    width: 50px;
    height: 50px;
    background-color: orange;
    border: 2px solid green;
  }
</style>

Event Data

e.sender kendo.ui.Draggable

The Draggable instance which fired the event.

e.target Element

The draggable element.

In this article
Not finding the help you need?