我正在寻找一种易于使用的方法,将拖动行为分配给画布中的多个对象(图像,形状等).有没有人有一个好方法或知道任何库拖动对象？谢谢
我有一个大脑屁,似乎无法得到我的jquery ui对话框的内容,以阻止'可拖动'.我关闭了实际对话框弹出窗口中的可拖动设置,但是,框内的内容仍然可以从框的视图中拖出.我想在盒子里面放一个静态定位盒子和静态定位内容.
这是我的代码:
$('.LinkBtn').click(function (e) {
e.preventDefault();
var OfferID = $(this).attr('id').substring(8);
$('#HiddenLinks_' + OfferID).show();
newDialog(OfferID);
});
function newDialog(OfferID) {
var divObj = $('#HiddenLinks_' + OfferID);
var $dialog = divObj
.draggable()
.dialog({
draggable: false,
autoOpen: false,
resizable: false,
modal: false,
title: $('#HiddenLinks_' + OfferID).attr('title')
}).draggable(false);
$dialog.dialog('open');
return false
}
谢谢!
很简单,我只想这样,当用户拖动一个项目并且它们到达视口的最底部或顶部(10px左右)时,页面(大约3000px长)轻轻向下或向上滚动,直到它们移动他们的光标(以及被拖动的项目)离开该区域.
项是一个li标签,它使用jquery使列表项可拖动.再具体一点:
我目前使用window.scrollBy(x = 0,y = 3)滚动页面并具有以下变量:
我怎样才能实现这一目标以及最适合这种情况的事件(目前在鼠标悬停中)？我的想法:
我的最新尝试:
('li').mouseover(function(e) {
totalHeight = document.body.offsetHeight;
cursor.y = e.pageY;
var papaWindow = window;
var $pxFromTop = $(papaWindow).scrollTop();
var $userScreenHeight = $(papaWindow).height();
var iterate = 0;
do {
papaWindow.scrollBy(0, 2);
iterate++;
console.log(cursor.y, $pxFromTop, $userScreenHeight);
}
while (iterate < 20);
});
在Google Maps v3参考中,我看到有一种方法setDraggable(boolean)可以应用于地图标记.
不过,我想设置setDraggable来true开启地图,没有在地图上标记.
我已在属性设置draggable来false在在MapOptions,但我不知道如何设置这true以后...... map.setDraggable(true)就不能正常工作:
// object literal for map options
var myOptions =
{
center: new google.maps.LatLng(37.09024, -95.712891),
zoom: 4, // smaller number --> zoom out
mapTypeId: google.maps.MapTypeId.TERRAIN,
// removing all map controls
disableDefaultUI: true,
// prevents map from being dragged
draggable: false,
// disabling all keyboard shortcuts
keyboardShortcuts: false,
disableDoubleClickZoom: true,
// do not clear …我正在尝试从jQuery重新创建Draggable + Sortable功能,并且无法将被删除的元素放入我的对象数组中.
我想将$ .draggable()按钮拖到$ .sortable()列表中.我希望按钮代表具有属性的对象(可以是关联数组,或对象本身),当我将其放入列表中时我希望它将自己放入数组中的位置.
为了清楚起见:我在左边的菜单中有一系列潜在的对象.在右边,我使用$ http来调用我的API来检索一个包含所有字段的表单,这些字段都保存在$ scope中.我希望将该潜在对象(如textarea)放入该表单的删除位置的字段中.
jquery位很简单,但是$ scope数组中不存在的对象是问题所在.
我很接近混合使用ui-sortable和$ .draggable指令包装器,但我的代码工作得不好.
我已经取得了进展,使用ui-sortable like指令结合包装$ .draggable()的指令,有点丑陋但有效.
我现在有它工作但我从jquery获取索引并使用php将其切片到该位置然后重新加载整个列表.谈论跛脚必须有更好的方法.
这是一个模块化的工作示例,适用于任何人的应用程序.
这个是IE特定的(显然不再是).我们有非常简单的代码:
<div draggable="true">
<p>Text</p>
<input type="text"/>
</div>
在Chrome上它工作正常,你可以选择里面的所有文字<input>,例如.双击它或单击并拖动.在IE10上,您无法执行这两个操作(在其他版本中不确定IE).有任何想法吗？
我正在使用interactjs.io创建一个可拖动的元素
我需要实现与jQuery UI snap完全相同的行为.您可以在官方文档中看到示例:
行为是:捕捉到所有其他可拖动元素
在interactjs.io中,在文档中,你有"Snapping"(l 墨水文档),但我没有找到编码方式.
我在这里创造了一个小提琴:小提琴链接
这是我的JS代码:
interact('.draggable')
.draggable({
onmove: dragMoveListener,
snap: {},
});
function dragMoveListener (event) {
var target = event.target,
// keep the dragged position in the data-x/data-y attributes
x = (parseFloat(target.getAttribute('data-x')) || 0) + event.dx,
y = (parseFloat(target.getAttribute('data-y')) || 0) + event.dy;
// translate the element
target.style.webkitTransform =
target.style.transform =
'translate(' + x + 'px, ' + y + 'px)';
// update the position attributes
target.setAttribute('data-x', …我想用Jquery的draggable来实现轻松的效果.但我没有在这个插件中找到该选项.所以我想知道是否有其他插件有这个选项 - 或一个简单的解决方案.
我试图实现的效果是这样的:http://www.fileden.com/files/2009/6/4/2466215/dragease.swf
正如您所看到的,在拖动时,由于缓和,图像移动感觉更平滑.我还想将拖动约束到一个轴,还需要使其恢复到它的位置.JQuery的draggable确实有最后两个选项,所以这很好.
示例代码已经为我提供了我想要的东西(除了缓动):http://jsfiddle.net/dandoen/NJwER/1/
任何建议将不胜感激.
干杯,丹多恩
很久以前我在我的应用程序中创建了一个对话框.对话框非常简单,位置绝对,通过javascript在屏幕中居中.
现在我已经将jQuery UI添加到应用程序中,但我不想仅仅因为它们的工作方式不同而使用jQuery UI的对话框.但我确实使用jQuery UI使我的对话框可以拖动,因为它非常简单:
$('#dialog').draggable();
有一个问题,我的一些对话框有滚动条.
但是使用可拖动的方法,如果有滚动条,它就会出错,因为它会拖动对话框.
有没有办法让对话框在使用滚动条时不拖动？
我注意到有一些方法可以避免拖动元素,但滚动条不是元素.
谢谢
编辑:JSFiddle:http://jsfiddle.net/FGXnR/
我已经搜索了STACKOVERFLOW和其他论坛以解决我的问题 - 如果我错过了一个有效的解决方案,请指向我.
我的问题:每当在可排序列表中拖动一个元素(一个portlet div)时,我需要在实际拖动过程开始之前执行一些操作(从我在START事件被触发之前理解).
更具体一点:我的DIV为用户提供了扩展/折叠它的主体的可能性(就像在jquery UI页面http://jqueryui.com/demos/sortable/#portlets中的示例一样).
每当拖动一个元素时我都想触发我的折叠方法,以便拖动的唯一可视元素是折叠的DIV.
无论何时我调用我的方法(类似这样)
$someitem.trigger("toggle.somenamespace")
它按预期工作,除了在sortable中触发start事件之前计算拖动帮助器的高度,因此帮助器具有处于未折叠状态的原始元素的高度.
我原来的想法是:因为可分类的例如在实际拖拽程序开始之前测量拖曳距离的可能性(使用选项:距离),它应该可以挂钩到这个流程中,例如存储原始的startDrag函数(或者无论它被称为临时var中的可排序小部件,都可以使用自定义回调覆盖它,该回调首先触发我的折叠功能,然后调用原始函数以确保正确计算高度.但是 - 到目前为止,这种方法并没有取得多大成功......
请注意,在处理程序中为拖动或在可排序事件上设置CSS属性具有所需的效果,因为为帮助程序计算的可排序窗口小部件的高度设置为元素属性.
或者 - 可能有人知道更好的方法来影响在拖动过程中显示的助手的高度,这只是我的观点,我的原始方法(在拖动过程之前更改元素,然后让小部件按照计算方式进行计算)它是有意的)将是一个更好的解决方案......
感谢任何帮助,马蒂亚斯
编辑:将可排序标志:forceHelperSize设置为true并在开始拖动器中设置ui.item /帮助器大小也不起作用,因为它可视地产生所需的效果(仅拖动折叠的项目,但停止元素一直拖下来(好像该项目仍然具有未折叠状态的高度)用帮助器测试:'原始'和'克隆'