使用JQuery Draggable(包括小提琴)的毛病行为

时间:2013-04-28 04:01:49

标签: javascript jquery jquery-ui jquery-isotope

我正在尝试使用Jquery Draggable,但是当目标物品被抬起然后掉落,悬停在旧位置上或从容器中取出时,我注意到闪烁。拖动的div中的图像只是消失或出现在错误的位置(拖动时应该始终显示在相同的位置 - 正如您所期望的那样)。

知道如何纠正这个问题吗?

我的代码:

http://jsfiddle.net/PTSkR/28/

$(function () {
            $('#container').isotope({
                // options
                itemSelector: '.study-box',
                layoutMode: 'fitRows'
            });
        });

        $(function () {
            $(".study-box").draggable({
                revert: "invalid",
                helper: function () {
                    // We removeAttr('style') to get rid of the transform css that isotope added.
                    return $(this).clone().removeAttr('style').removeClass('isotope-item').addClass('drag-helper').appendTo('body');
                },
                start: function () {
                    $(this).hide();
                },
                stop: function () {
                    $(this).show();
                },
                zIndex: 100
            });
        });
        $(function () {
            $(".folder-box").draggable({ revert: "invalid" });
            $(".folder-box").droppable({
                // revert: "invalid",
                accept: ".folder-box, .set-box", 
                drop: function (event, ui) {
                    var $this = $(this);
                    //ui.draggable.clone().removeAttr('style').removeClass('.folder-box').appendTo($this);
                    $('#container').isotope('remove', ui.draggable);
                }
            });
        });

1 个答案:

答案 0 :(得分:0)

JavaScript没有任何问题,只需从CSS中删除所有“position:fixed”即可。它正在弄乱背景位置的正确显示。