SORU
20 NİSAN 2011, ÇARŞAMBA


Bir sürüklenebilir geri dönmek jQuery droppable dışında olay orijinal kabına nesne

Droppable bir geri düştü değilse hangi sürüklenebilir bir madde var. Bu bir kullanıcı droppable bir öğe damla kadar iyi çalışıyor. Eğer her zaman hata yaptıklarını karar verirseniz onlar droppable döner dışarı sürüklenebilir çekiyorlar. Ve devre dışı bırakmak sürüklenebilir özgün kabına gider tercih ederim.

Benim kod ama a sample on jsFiddle sağladım altındadır.

HTML

<div id="origin">
    <div id="draggable" class="ui-widget-content">
        <p>I revert when I'm not dropped</p>
    </div>
</div>
<div id="droppable" class="ui-widget-header">
    <p>Drop me here</p>
</div>

JavaScript

$(function() {
    $("#draggable").draggable({ 
        revert:  function(dropped) {
           var dropped = dropped && dropped[0].id == "droppable";
           if(!dropped) alert("I'm reverting!");
           return !dropped;
        } 
    }).each(function() {
        var top = $(this).position().top;
        var left = $(this).position().left;
        $(this).data('orgTop', top);
        $(this).data('orgLeft', left);
    });

    $("#droppable").droppable({
        activeClass: 'ui-state-hover',
        hoverClass: 'ui-state-active',
        drop: function(event, ui) {
            $(this).addClass('ui-state-highlight').find('p').html('Dropped!');
        },
        out: function(event, ui) {
                // doesn't work but something like this
                ui.draggable.mouseup(function () {
                var top = ui.draggable.data('orgTop');
                var left = ui.draggable.data('orgLeft');
                ui.position = { top: top, left: left };
            });
        }
    });
});

CEVAP
1 Mayıs 2011, Pazar


$(function() {
    $("#draggable").draggable({
        revert : function(event, ui) {
            // on older version of jQuery use "draggable"
            // $(this).data("draggable")
            // on 2.x versions of jQuery use "ui-draggable"
            // $(this).data("ui-draggable")
            $(this).data("uiDraggable").originalPosition = {
                top : 0,
                left : 0
            };
            // return boolean
            return !event;
            // that evaluate like this:
            // return event !== false ? false : true;
        }
    });
    $("#droppable").droppable();
});

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • HowcastFoodDrink

    HowcastFoodD

    21 EYLÜL 2010
  • Jana Williams

    Jana William

    17 AĞUSTOS 2011
  • SellerDp

    SellerDp

    27 EKİM 2009