使用jquery平滑过渡到div排序
使用jquery平滑过渡到div排序
提问于 2016-11-14 02:46:43
我正在尝试为我正在使用jquery排序的div添加一个平滑过渡。
排序可以正常工作，但不会添加平滑的过渡。我使用了定义了速度的animate，但没有区别。
Jquery代码：
$("body").on('click tap', '.sort-arrows .fa-arrow-down', function(e) {
e.preventDefault();
var pos = $(this).parent().index();
var elem = $(this).closest("div").parent();
elem.next().after(elem).animate(1000);
});
$("body").on('click tap', '.sort-arrows .fa-arrow-up', function(e) {
e.preventDefault();
var pos = $(this).parent().index();
var elem = $(this).closest("div").parent();
elem.prev().before(elem).animate(1000);
});演示-- https://jsfiddle.net/gvyoj63a/4/
任何帮助都是非常感谢的。
回答 1
Stack Overflow用户
发布于 2016-11-14 03:28:24
通过这篇文章得到了一个解决方案-- Re-ordering div positions with jQuery?
我的代码--
$("body").on('click tap', '.sort-arrows .fa-arrow-down', function(e) {
e.preventDefault();
var pos = $(this).parent().index();
var elem = $(this).closest("div").parent();
alert(elem.index());
if (elem.index() <= (elem.siblings('div').length - 1)){
elem.fadeOut('slow', function() {
//elem.next().after(elem).fadeIn('slow');
elem.insertAfter(elem.next('div')).fadeIn('slow');
});
}
});
$("body").on('click tap', '.sort-arrows .fa-arrow-up', function(e) {
e.preventDefault();
var pos = $(this).parent().index();
var elem = $(this).closest("div").parent();
alert(elem.index());
if (elem.index() > 0) {
elem.fadeOut('slow', function() {
// elem.prev().before(elem).animate(1000);
elem.insertBefore(elem.prev('div')).fadeIn('slow');
});
}
});我的演示是-- https://jsfiddle.net/gvyoj63a/5/
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/40577485
复制相关文章
相似问题
腾讯云开发者
