我有两个可排序的链表,分别称为列表 1 和列表 2。
列表 1 是用户可以选择的所有可能项目的列表,他将它们拖到列表 2 的购物篮中。
我想做的是在列表 2(购物篮)中的每个项目旁边有一个按钮(或链接),单击该按钮时会将项目移回列表 1,而用户实际上不必将其拖到那里。
我知道我可以通过简单地使用remove()从列表2中删除项目,然后使用append()或after()等将其添加回列表1来轻松实现这一点,但我希望该运动能够被动画化。
有没有一种方法可以实现这一点,以便该项目自动从一个列表“拖动”到另一个列表?如果是这样怎么办?
我已经仔细查看了周围但无济于事,但如果可以的话该网站会好得多。因此,您能提供的任何帮助将不胜感激。
谢谢。
好吧,我找到了答案,所以我想既然我问了这个问题,我应该把答案放在这里以帮助其他需要知道的人。
我有点愚蠢地寻找一种通过 jquery ui 来完成此操作的方法,因为我的列表可排序这一事实是无关紧要的,我只需要用户 jquery 来移动元素并为其设置动画。
下面的函数对此非常有用:
function moveAnimate(element, newParent){
var oldOffset = element.offset();
element.appendTo(newParent);
var newOffset = element.offset();
var temp = element.clone().appendTo('body');
temp .css('position', 'absolute')
.css('left', oldOffset.left)
.css('top', oldOffset.top)
.css('zIndex', 1000);
element.hide();
temp.animate( {'top': newOffset.top, 'left':newOffset.left}, 'slow', function(){
element.show();
temp.remove();
});
}
它是由 Davy8 在这个线程上提供的:JQuery - 将 DOM 元素移动到新父级的动画? https://stackoverflow.com/questions/907279/jquery-animate-moving-dom-element-to-new-parent
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)