0

首先使用 jquery-ui draggable() 生成一个可拖动的框,并在顶部生成一个句柄。

但是,有时框内的内容可能会闪烁,这往往会导致拖动功能移动得太慢。我决定移动到重影类型系统,在其中拖动它,它会显示一个你正在移动它的框,然后将它移动到你放置它的位置。

我已经让它在 Chrome/Firefox 中完美运行,但无法让它在 IE8 或 IE9 中运行。想知道是否有人有任何建议。下面是jquery特定的代码。

$(document).ready(function () {
$container = $('#container');
$container.draggable({
    handle: "#header",
    containment: "parent",
    scroll: false,
    helper: function () {
        return "<div class='dragbox' style='width:" + ($container.width()) + "px;height:" + ($container.height()) + "px'></div>";
    },
    stop: function (e, ui) {
        var top = ui.position.top,
            left = ui.position.left;
        $container.css({
            'top': top + "px",
                'left': left + "px"
        });
    }
});
});

示例可以在http://jsfiddle.net/Ep5wu/找到。

提前致谢!

4

1 回答 1

0

拖动停止事件中的参数 'ui' 是自身拖动的元素,而不是 'helper' div(绿色框)。在拖动停止后,您需要 'helper' 的顶部/左侧值。

试试这个..在 IE10 中工作

$(document).ready(function () {
        $container = $('#container');
        $container.draggable(
        {
            handle: "#header", scroll: false,       
            helper:function () {
                return "<div class='dragbox' style='width:" + ($container.width()) + "px;height:" + ($container.height()) + "px'></div>";
            },
            stop: function (e, ui) {
                console.log(ui.helper);
                var top = $(ui.helper).offset().top;
                var left = $(ui.helper).offset().left;
                $container.css({
                    'top': top + "px",
                    'left': left + "px"
                });
        }
            });
    });

在这里小提琴:http: //jsfiddle.net/Ep5wu/16/

于 2013-06-07T17:11:22.510 回答