安卓手机可以直接装Linux吗
安卓手机可以直接装Linux吗
最满意答案
jqueryUI的拖拽提供了三个事件。开始拖动前,拖动中,拖动放下。你所说的 "当两个div有重叠的部分,拖拽的div就还原会原来的位置",任何一个框架都不会帮你实现。因为这个要求的位置太精确了。任何框架都不可能帮你实现。因为拖动对象的尺寸边框,都是未知的。无规矩可寻。目前的拖动事件,鼠标事件。浏览器实现的机制都是以鼠标位置为判断的。而如果你要实现的话,你需要:1 个容器。 2 精确计算每个被拖动div的尺寸和当前鼠标相对于容器的坐标。 3 拖动中事件不断的进行位置判断。即在drag事件中判断。
比如:
<div id="container" style="width:600px;height:600px;">
<div id="div1" style="width:100px;height:100px;"></div><div id="div2" style="width:100px;height:100px;"></div>
</div>
假设你现在拖动div2,你想要实现,当拖动过程中。div2碰到div1的时候。就让div2回到原来的位置。
那么最关键的一点是。你在drag事件中必须要不断的计算,div2位置是否和div1位置重合。
计算是否重合的思路就是:将尺寸对比,转化成二维坐标对比。计算出div1的初始静态坐标。
根据鼠标当前相对于容器的坐标和div2的尺寸,计算出div2四个边缘的动态坐标。再和div1的坐标对比。
其他回答
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>jquery ui Draggable使用 jquery ui 鼠标拖拽元素使用</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
<link rel="stylesheet" href="http://jqueryui.com/resources/demos/style.css">
<style>
#draggable { width: 150px; height: 150px; padding: 0.5em; }
</style>
<script>
$(function() {
$( "#draggable" ).draggable();
});
</script>
</head>
<body>
<h2>jquery ui Draggable使用 jquery ui 鼠标拖拽元素使用</h2><br/>
<div id="draggable">
<p>拖拽我</p>
</div>
</body>
</html>
相关问答
更多-
jquery ui draggable拖拽元素[2024-02-17]
jqueryUI的拖拽提供了三个事件。开始拖动前,拖动中,拖动放下。 你所说的 "当两个div有重叠的部分,拖拽的div就还原会原来的位置",任何一个框架都不会帮你实现。因为这个要求的位置太精确了。任何框架都不可能帮你实现。因为拖动对象的尺寸边框,都是未知的。无规矩可寻。目前的拖动事件,鼠标事件。浏览器实现的机制都是以鼠标位置为判断的。而如果你要实现的话,你需要:1 个容器。 2 精确计算每个被拖动div的尺寸和当前鼠标相对于容器的坐标。 3 拖动中事件不断的进行位置判断。即在drag事件中判断。 比如: ... -
jQuery UI 的拖拽范围问题[2023-09-12]
可以在开始的时候设置containment。 $(function() { $( "#draggable5" ).draggable({ 'containment':[x1,y1,x2,y2] }); }); x1,y1,x2,y2变化的时候调用 $( "#draggable5" ).draggable("option", "containment", [x1,y1,x2,y2]); -
尝试设置一下:div的index。因为DIV重叠会导致块级元素不能共存在一个index的问题。 我没有看过这个插件。不过我觉得应该作者会有写关于重叠的问题。可以再仔细查看一下
-
当你将droppable放入drop target后稍微移动它并且它失去了可拖动性,那是因为 $this.html(""); 在drop handler中,draggable仍然在drop目标中。 擦除放置目标的HTML时,还会删除应该重新附加的元素。 这会返回一个语法错误,因为该元素不再存在,从而中断了克隆的操作,并且可擦除了拖动。 这是一个快速修复: drop: function(event, ui) { var $this = $(this); if ($this.find('.u ...
-
jQuery UI可拖拽的克隆(jQuery UI Draggable Clone)[2022-01-16]
由于动态生成了丢弃的li元素(以及其内部的关闭按钮),因此您需要使用以下语法将事件绑定到它。 您使用的语法不会将事件绑定到动态创建的元素。 参考: 动态创建的元素上的事件绑定? 。 $(".sortable").sortable({ revert: true, connectWith: ".draggable" }); $(".draggable").draggable({ connectToSortable: ".sortable", helper: "clon ... -
刚刚删除destroy draggable on drop event这里正在运行jsfiddle drop: function( event, ui ) { var text = ui.draggable.html(); $(".cart").append(''+text+''); ui.draggable.data('dropped', true); $(ui.draggable).draggable({ ...
-
不幸的是,设置助手宽度的ui.sortable代码并未按照指定的方式考虑该类的宽度。 我正在使用jQuery 1.8.x,并偶然发现了这种相同的行为。 查看源代码,我看到ui.sortable正在检查元素上是否指定了宽度样式,如果不是,请将其设置为排序中第一个元素的宽度。 我的解决方案是使用可拖动辅助选项的函数形式显式设置助手的宽度和高度。 $('#draggable').draggable({ helper: function() { var helper = $(this).cl ...
-
jQuery ui draggable element获取其他可拖动元素(jQuery ui draggable element gets under other draggable elements)[2022-02-22]
我发现我的代码只在第一次工作 - 我从你的JQuery和你的css中删除了一些z索引,现在它每次都在为我工作: http://jsfiddle.net/zbo7g5nz/5/ 我的jFiddle似乎没有更新分享..这是工作代码: $(".slide").draggable({ // brings the item back to its place when dragging is over revert:true, // once the dragging ... -
尝试: // selector means "doesn't have", ':not(:has(selector))' $(".ui-draggable:not(:has(.ui-draggable-disabled))").hover(function() { ... 要么: $('.ui-draggable').not(':has(.ui-draggable-disabled)').hover(function() { 或者在hover鼠标悬停/ mouseout函数中测试是否存在已禁用的类: $ ...
-
使用 $( '' ).prop( 'draggable', true ) 而不是$( '', { draggable: true } ) 。 示例: http : //codepen.io/anon/pen/adNrPq 。 Use $( '' ).prop( 'draggable', true ) Instead of $( '', { draggable: true } ). Example: http://codepen.io/anon/pen/ad ...