jjzjj

draggable

全部标签

javascript - 具有多个句柄的 Jquery Draggable

draggable元素是否可以有多个句柄?我将它初始化两次,每次都使用不同的句柄参数,但它不起作用-只有第一个有效。 最佳答案 你应该只传递一次'handle'参数,它可以是一个选择器或一个元素(/s)。因此,要使其适用于多个句柄:$(elem).draggable({handle:'#handle1,#handle2',});更多信息/来源:http://docs.jquery.com/UI/Draggables/draggable 关于javascript-具有多个句柄的Jquery

javascript - jquery ui 拖动缓动/惯性

使用jqueryuidraggable(http://jqueryui.com/demos/draggable/)拖动元素时如何启用缓动或惯性?我想重新创建类似于maps.google.com的缓动,当你扔/拖动map时它会缓动到位。理想情况下,我想根据您throw/拖动元素的力来移动元素。你如何实现这个功能?也许jqueryuidraggable不是必需的,但我希望模拟Googlemap上的拖动和缓动。谢谢! 最佳答案 我使用了here中的一些想法但将它们与jQueryUI集成在一起。您必须实现逻辑来处理将元素推出边界(超出其父容

javascript - 序列化 DOM 元素,包括所有 CSS 属性

我正在开发一个像yola.com这样的在线网站设计系统。我想获取应用的CSS属性及其值到任何DOM元素的列表。例如,我有一个h1标签,它的css在调整大小和拖动时由jqueryui随机更改,还通过tinymce等更改其文本装饰和文本内容等。我在这个页面上有一个保存按钮。当我点击保存时,我想使用php将所有这些更改保存到数据库中。现在我的目标是只知道每个元素的css和内部文本内容。我该怎么做? 最佳答案 在javascript中,您可以通过调用找到元素的当前类名element.getClassName();至少在当前版本的firefo

javascript - 如何使用 Draggable 和 Selectable JQuery 将一个或多个项目拖动到一个元素

我想知道如何将一个或多个项目(在我的案例中是个人记录,通过他们的头像照片)拖动到目标(在我的案例中是城市列表),然后更新拖动项目的数据库包含他们被拖到的项目的详细信息。我目前正在为单个项目工作。我有一个侧边栏,其中包含我使用EntityFramework从数据库中检索到的位置列表:SydneyBrisbaneMelbourne在我的主窗口中,我有一个人物图像网格,我正在使用可选择的JqueryUI来启用这些图像:@foreach(variteminModel.People){}$(function(){$("#selectable").selectable({selected:func

javascript - 当拖动然后将项目垂直放置在可排序的网格中时,Packery 会中断垂直对齐

我在尝试使用packery和draggabilly创建可排序的项目网格时遇到问题。我也尝试过jqueryuidragabble,但问题仍然存在。当我拖放项目时,可能会破坏垂直对齐方式,因此项目会“捕捉”到行的一部分。这也打乱了项目的顺序。http://jsfiddle.net/foobass/sasrx654/如果您水平拖动一个项目,它会卡入到位并很好地对齐。如果您垂直拖动,您可能会失去对齐,它不会正确地卡入到位。最后一个项目的位置也发生了变化。任何人都可以建议我可能做错了什么吗?varcontainer=document.querySelector('#container');var

JavaScript/jQuery : Animate li movement within a list?

我有一些代码与此处的jQueryUISortable示例基本相同:http://jqueryui.com/demos/sortable/#default这允许用户重新排序UL中的LI元素。不过,我现在遇到了一种情况,我想为LI改变位置设置动画……基本上就像用户自己拖动它们一样。事实证明,这比我预期的要困难得多,因为我没有为可以用CSS表达的变化制作动画,所以jQuery的animate()不会有帮助。我可以通过做一些数学运算并绝对定位列表元素来解决这个问题,但这看起来非常丑陋。有没有一种优雅的方法可以让我的列表元素四处移动? 最佳答案

Javascript(jQuery)在拖动项目时禁用页面滚动

我有一个类似小部件的系统,其中的小部件可以四处拖动(使用jQuery可拖动/可排序)。现在的问题是,当用户拖动这些小部件之一并将光标移动到边缘时,父div会滚动到光标的方向。一个简化的布局如下:有什么方法可以禁止page_wrapper滚动吗? 最佳答案 尝试在page_wrapper的css中添加overflow:hidden;。 关于Javascript(jQuery)在拖动项目时禁用页面滚动,我们在StackOverflow上找到一个类似的问题: htt

javascript - 带有碰撞检测的 jQuery 拖动

我有以下HTML:Item1Item2Item3我希望使用jQuery能够做到的是:能够将.item从#list拖到#timeline.item可以根据需要多次放入时间线,例如。时间线中可能有4个项目#i1。.item在时间轴中不能相互重叠.item可以放置在时间轴上的任何位置,只要它们不与时间轴上的任何其他项目重叠所以我选择了jQueryUI的Draggable和Droppable,也选择了jQueryUIDraggableCollisionPlugin.这是我开始使用的jQuery:$('#list.item').draggable({helper:'clone',revert:'

javascript - 隐藏的 jQuery 可拖动包含溢出

这是关于拖动比其父元素更宽的元素(溢出:隐藏)。父级的宽度和溢出选项是固定的,无法更改。HTMLThequickbrownfoxjumpsoverthelazydog.CSS.container{position:relative;width:300px;height:50px;background:#ccc;overflow:hidden;//becareful,changingtooverflow-x:hiddenbreakstheanswer}.text{position:absolute;top:7px;margin:0;width:1000px;font-size:30px;

javascript - 使用jquery ui时有什么方法可以控制元素的排序

我有一个可排序的div(#sortable),里面有元素(.draggable)。在那里,当我从下到上对元素进行排序时,可以通过向上拖动轻松地对元素进行排序,而不必将太多内容拖到顶部。但是当从上到下对元素进行排序时,我必须将元素拖到远低于所需的位置。有什么方法可以控制元素的排序,这样即使我只向上/向下拖动一点点而不是一直向上/向下拖动,它也会显示占位符以分别放置元素?演示在codepen.js$('#content#sortable').sortable({handle:'.drag_handle',placeholder:"ui-state-highlight",axis:"y"})