drag and drop cursor/pointer

3 posts, 1 answers
  1. David Ocasio
    David Ocasio avatar
    147 posts
    Member since:
    Nov 2009

    Posted 21 Jan 2014 Link to this post

    I am using the cursoroffset to position the pointer below and to the left of what is being dragged.

    While this works great the cursor changes to a standard pointer is there anyway to have it change to something else(preferably cross hair) while dragging and then revert to default after drop.

    thanks
    dco
  2. Answer
    David Ocasio
    David Ocasio avatar
    147 posts
    Member since:
    Nov 2009

    Posted 23 Jan 2014 Link to this post

    Hi David,

    This is not supported out-of-the-box, however it can be achieved via additional code. For example:
    • Set to the draggable element cursor: crosshair style;
    • In the dragStart event change the body cursor style to crosshair;
    • In the dragend set the body cursor style to default.
      <script>
      $("#draggable").kendoDraggable({
         //....
        dragstart: function(){
           //....
           $('body').css('cursor', 'crosshair');
        },
        dragend:  function(){
           $('body').css('cursor', 'default');
        }
      });
      </script>
       
      <style>
      #draggable {
        /*....*/
        cursor: crosshair;
      </style>
            
    Regards,
    Iliana Nikolova
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
  4. David Ocasio
    David Ocasio avatar
    147 posts
    Member since:
    Nov 2009

    Posted 23 Jan 2014 Link to this post

    perfect

    thankyou
    David Charles Ocasio
Back to Top