【问题标题】:how to drag 2 div at the time如何同时拖动2个div
【发布时间】:2023-03-19 22:52:01
【问题描述】:

如何制作,当第一个div拖动时,第二个div也拖动

使用 jquery ui 拖动第一个 div

<div id="draggable"  style="position: absolute; z-index: 999; width: 100px; height: 100px; background: orange;"></div>
<div id="xren" style="position: absolute; z-index: 998; width: 100px; height: 100px; background: orange;"></div>

<script type="text/javascript">
  var a = $('#draggable').offset();
 $('#xren').css("top", a.top + 100 + "px");
 $('#xren').css("left", a.left + 100 + "px");

但它不起作用

第一个 div 用 jquery ui 拖动 & 第二个 div 在第一个 div 拖动时拖动

【问题讨论】:

  • 有什么理由不把它们放在一个可拖动的 div 中?
  • @Chris 当然......他会说是的。
  • @user1008575:通常会有充分的理由,但如果明显的解决方案无效,那么我们显然没有得到整个问题,因此要么遗漏了明显的答案,要么遗漏了一些有用的细节问题被错过了。所以要么问题得到回答,要么问题可以做得更好。

标签: javascript jquery html css jquery-ui


【解决方案1】:

类似:

$("#div1").bind("drag", function(){
    var offset = $(this).offset();
    $("#div2").css({ left : offset.left, top: offset.top});
});

反之亦然。

【讨论】:

    【解决方案2】:

    您必须在 div 上设置正确的位置属性,然后才能移动元素。 请参阅 /2 和 /0.5 这是定义比率的分隔符。

    HTML

    <div id="div1">AAA</div>
    <div style="position: absolute;">
        <div id="div2" style="position:relative">BBB</div>
    </div>
    

    JS

    $("#div1").draggable({
        drag: function(event, ui) {
            var offset = ui.offset;
            $("#div2").css({ left : offset.left /2, top: offset.top/0.5});
        }
    });
    

    示例:http://jsfiddle.net/jmav/uj6T6/

    【讨论】:

      猜你喜欢
      • 2011-12-17
      • 1970-01-01
      • 1970-01-01
      • 2017-01-12
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2021-05-11
      相关资源
      最近更新 更多