保持Bootstrap"列的宽度"使用jquery draggable拖动时的元素

时间:2014-07-15 15:55:57

标签: jquery twitter-bootstrap twitter-bootstrap-3 draggable jquery-ui-draggable

我遇到了使用bootstrap(3.x)框架的问题,我们已经指定使用jquery的draggable功能可以拖动元素列表,但是一旦元素开始拖动,它就会从它的容器.row流中移除,因为jquery会添加position:absolute;所以正确的宽度会丢失。

例如,如果draggable元素具有类.col-lg-6,它通常是包含.row的50%,但是一旦我开始拖动,该元素立即变为视口的100%而不是

如何设置可拖动项目的样式,使其在拖动过程中保持原始大小?

1 个答案:

答案 0 :(得分:0)

您只需从原始元素中获取尺寸并将其应用于辅助元素:

$(el).draggable({
  helper: 'clone',
  start: function (event, ui) {
    var w = $(this).css('width');
    var h = $(this).css('height');
    ui.helper.css('width', w).css('height', h);
  }
});

Demo here