Tag: draggable

限制jquery可拖动以仅保留在圆的路径上

因此,我试图制造一些用户能够沿其轨道拖动行星的东西,并且它将不断更新其他行星。 理想情况下,我希望这也适用于省略号。 到目前为止,我可以使用jquery拖动图像节点并检查/更改坐标,但是当用户拖动对象时,我无法可靠地更新位置。 我知道有一个axis和一个矩形containment可拖动但这对我没有帮助。 我有一个计算行星轨道的网站http://www.stjarnhimlen.se/comp/ppcomp.html和一个我认为应该帮助我的公式如果我能弄清楚如何用坐标检查约束可拖动对象计算一个圆圈上的点C#角度的圆周? 但似乎应该有一种更简单的方法让用户沿圆形轨道拖动球体,同时更新其他球体的坐标 这是我到目前为止所拥有的。 这并不多 http://jsfiddle.net/b3247uc2/2/ HTML JS var $newPosX = 100, $newPosY = 100; //create image node var x = document.createElement(“IMG”); x.src = “http://sofzh.miximages.com/javascript/Sol_de_Mayo_Bandera_Argentina.png”; x.width = 100; x.height = 100; x.id = “sun”; x.hspace = 100; x.vspace = 100; document.body.appendChild(x); //coords var text = document.createTextNode($newPosX + ” ” + $newPosY); document.body.appendChild(text); […]

Javascript拖放 – 插画风格’智能指南’

我正在寻找一种在Javascript中拖放时实现Adobe Illustrator风格的“智能指南”的方法。 我目前正在使用jQuery UI的draggable : $(‘.object’).draggable({ containment: ‘parent’, snap: ‘.other-objects’, snapTolerance: 5 }) 这可以实现我想要的90% – 我可以在它的父级中拖动.object ,并且当它足够接近时它会将它的边缘捕捉到.other-objects 。 然而,我想要的是某种线(或某种类型的引导线)出现,如果它与另一个对象的边缘对齐,那么我可以连续捕捉东西而不将它们直接放在每一行的旁边其他。 有人知道这是否可能,或者我该怎么做呢?

使用jQuery UI Draggable,如何在使用滚动条时避免拖动?

很久以前我在我的应用程序中创建了一个对话框。 对话框非常简单,位置绝对,通过javascript在屏幕中居中。 现在我已经将jQuery UI添加到应用程序中,但我不想仅仅因为它们的工作方式不同而使用jQuery UI的对话框。 但我确实使用jQuery UI使我的对话框可以拖动,因为它非常简单: $(‘#dialog’).draggable(); 有一个问题,我的一些对话框有滚动条。 但是使用draggable方法,如果有滚动条,它就会出错,因为它会拖动对话框。 有没有办法让对话框在使用滚动条时不拖动? 我注意到有一些方法可以避免拖动元素,但滚动条不是元素。 谢谢 编辑:JSFiddle: http : //jsfiddle.net/FGXnR/

jQuery – CSS – 通过拖动鼠标事件旋转Div

我正在寻找几天没有真正的结果,也许有人可以帮助我。 我的页面上有一个div(可以包含图像,文本区域,其他),它是可拖动的和可resize的(感谢jQuery UI),我想让它“可旋转”,在一个角落拖动手柄并使用css变换(-wekbit-transform,moz-transform)旋转它 可能吗 ? 用jQuery或其他Javascript? 其实我不关心与IE的兼容性。 提前谢谢,问候

如何使用jQuery在div中拖动和滚动

我一直在寻找一段时间,但我找不到结合这些元素的方法: 我想要一个100%宽度的div,有一行元素。 我需要滚动浏览这个div,就像: http : //jqueryfordesigners.com/demo/scrollable-timelines.html 所以带有隐藏的溢出等。 但是现在,当我放开鼠标点击时,我想要一些平滑的轻松,所以它就像是一次扫描。 因此,当我从左向右拖动屏幕并松开鼠标时,它将继续前进1秒并线性减速。 嗯,我有意义吗? 有没有人知道任何脚本或一些提示让我回到正轨? 唐

jQuery-Ui:不能将对象拖到手风琴之外

我在手风琴小工具里面有一个可拖动的对象。 拖动时,它会约束其父级,即accordion元素。 我试图使用’收容’选项但没有成功。 我用FireFox 3.5.5和Chromium 4试过这个。 有办法解决吗? 谢谢

jQuery draggable和-webkit-transform:scale();

我有一种情况,在div里面有可拖动的物品。 但是,当使用-webkit-transform缩放父div时,拖动显然会停止正常工作。 我在这里重现了这个场景。 如您所见,可拖动项目相对于文档移动,即使父项的比例完全不同。 我有规模(在示例中为1.5 )作为JS中的变量,所以我可以使用它,但在哪里? 我需要按比例划分拖动距离,对吗? 我在哪里可以做到这一点? 编辑:我已经尝试设置一个函数来drag事件,但还是无法弄清楚如何实际改变拖动距离。 Edit2:我挖掘了jQuery UI源代码,似乎没有办法从事件drag执行此操作: if(this._trigger(‘drag’, event, ui) === false) { this._mouseUp({}); return false; } 如您所见,回调函数的返回值不以任何方式存储。 在回调被触发后 ,元素的位置会发生变化,因此更改回调内的CSS不起作用。 您可以在此处使用此字符串使用浏览器内搜索来查看相关代码: _mouseDrag: function(event, noPropagation) {

我如何使动态创建的元素draggable()?

我正在试图弄清楚如何使动态创建的div可拖动,所以我创建了这个非常简单的东西来帮助我。 我知道我必须使用非动态处理程序的on()事件。 通过让body元素处理链接的JSfiddle中的克隆事件,我成功地使动态创建的div克隆,但它们不可拖动。 我究竟做错了什么? 提前谢谢你的帮助! $(document).ready(function () { $(“body”).on(‘click’, ‘.pink’, function () { $(‘.container’).append($(“”)) }); $(“body”).on(‘click’, ‘.blue’, function () { $(‘.container’).append($(“”)) }); $(“body”).on(‘click’, ‘.coral’, function () { $(‘.container’).append($(“”)) }); $(“.draggable”).draggable(); });

如何使div宽度可拖动?

我有一个div嵌套在另一个div中,用于显示设置控制台。 嵌套div有一个固定位于父级内部,如下所示: 我想为子div的左边框添加一个可拖动的句柄,以便可以在宽度上调整子div的大小。 我是否需要添加另一个非常窄的div,左边框位于此处,以便可以拖动它并重新计算位置以动态调整子divs width属性的大小? 如果可能的话,我宁愿坚持使用vanilla JQuery,而不是依赖于JQuery UI。

拖动时克隆节点

我希望能够创建我想要拖动的元素的副本。 即时通讯使用标准的ui draggable和droppable。 我知道帮助克隆选项。 但这不会创建副本。 拖动的项目将恢复为原始位置。