CODEWITHSUNDEEP
jqueryjquery-uidraggabledroppable
Estern
Estern

Reputation: 129

JQuery UI get width and height of dropped element

How can I get the height and width of the drop element? I tried 'ui.draggable.width' or 'ui.width' but it doesn't work. This my code:

      $('#bagpack').droppable({
            accept: '.item',
            drop: function(ev, ui) {
                  console.log( ui.draggable.width ); // Doesn't work
                 if (ui.offset.left - $(this).offset().left < -20 || ui.offset.top - $(this).offset().top < -20 ||
                      ($(this).offset().left + $(this).width()) - (ui.offset.left + ui.draggable.width / 2)  < 20 ||
                      ($(this).offset().top + $(this).height()) - (ui.offset.top + ui.draggable.height / 2)  < 40 )
                 {
                     $(ui.draggable).draggable({
                         revert: true,
                         stop: function(){
                             $(ui.draggable).draggable('option','revert','invalid');
                         }
                     });
                 }
                 else
                 {
                      itemEquip(ui.draggable, this, ui.offset.left - $(this).offset().left, ui.offset.top - $(this).offset().top);
                 }
            }
    });

Upvotes: 0

Views: 1177

Answers (1)

koolkat
koolkat

Reputation: 846

Use the height() and width() functions on the $(ui.draggable) element. For example,

$('#bagpack').droppable({
        accept: '.item',
        drop: function(ev, ui) {
            console.log($(ui.draggable).width());
            console.log($(ui.draggable).height());
        }

Upvotes: 1

Related Questions