jQuery Draggable在拖动上有问题吗? [英] jquery draggable has an issue on dragging?

查看:118
本文介绍了jQuery Draggable在拖动上有问题吗?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想恢复红色块的位置,红色块是可拖动的div,位于绿色和灰色块上,而不是蓝色块中,它不适用于绿色块,但它适用于灰色块,请帮助我...为此我正在使用jquery恢复.代码和lnk在下面,请帮助我 http://galtech.org/testing/drag.php

I wanted to restore the position of red block which is a draggable div on the green and gray block and not in blue block it is not worked on green block but it worked on gray block please help me ... For this purpose I am using jquery revert. The code and lnk are below please help me http://galtech.org/testing/drag.php

<style type="text/css">
    #draggable { width: 100px; height: 70px; background: red; }
    #nodrag { width: 200px; height: 270px; background: #00CC66; }
  </style>

</head>
<body >
<div style="background:#CCCCCC;">
     <div id="droppble_blue" style="background:#99CCCC; height:500px; width:620px;"> 
        <div id="draggable" >Drag</div>
        <div id="nodrag" class="new">no Drag & drop here</div>
    </div>
</div>
</body>
</html>
  <script>
  $(document).ready(function() {
    $("#draggable").draggable({ revert: "invalid" });
    $("#droppble_blue").droppable({drop: function() { alert('dropped');}});
  });
  </script>

推荐答案

我没有使用可拖动的jQuery,但是会

I have not used draggable jquery but would

$("#nodrag").droppable({drop: function() { $('#draggable').css({top:'0px',left:'0px'});}});

工作吗?

进一步研究可拖动的内容,没有一种有效的方法来还原有效元素内的块,因此我将进行以下操作

Looking further into the draggable stuff there isn't an obvious way to the revert with blocks inside valid elements so I would do the folllowing

$("#draggable").draggable('option', 'start', function(){
   //when drag starts save the positions somewhere
   $(this).data('left',$(this).css('left')).data('top',$(this).css('top'))
});
$("#nodrag").droppable({drop: function(e,ui) {
    //when dropped on an invalid block move it back to where it was (you could change this to animate to mimic revert)
    $(ui.draggable)
   .css({left:$(ui.draggable).data('left'),top:$(ui.draggable).data('top')});
}});

这篇关于jQuery Draggable在拖动上有问题吗?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆