将数组的（this）元素移动到末尾

Question

我有一些html元素，我想在使用jQuery点击它们时移动。 我已经尝试了这个，但它没有工作

var element = $('.picAll');
var arr = jQuery.makeArray(element);

arr[3].animate({"margin":"90px 0 0 35%", "z-index":"1"});
arr[2].animate({"margin":"35px 0 0 20%", "z-index":"4"});
arr[1].animate({"margin":"55px 0 0 25%", "z-index":"3"});
arr[0].animate({"margin":"75px 0 0 30%", "z-index":"2"});

$('.picAll').click(function() {
element(this).push();
});

我还是初学者，所以我很抱歉代码不好......

Answer 1

将元素推送到数组的末尾

＆＃13;

＆＃13;

var b = $("b").get();
b.push(b.shift());
$("body").append( b ); // `b` or `$(b)`

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<b>a</b><b>b</b><b>c</b>

＆＃13;

＆＃13;

＆＃13;

设置/存储自定义动画属性

存储您的对象文字，然后您将.animate()传递到自定义元素属性（即：anim）。 元素点击只需回忆它的属性 P.S：请注意，你无法为z-index制作动画......但是你去了：

＆＃13;

＆＃13;

var pic = $('.picAll');

pic[3].anim = {margin:"90px 0 0 35%", zIndex:"1"};
pic[2].anim = {margin:"35px 0 0 20%", zIndex:"4"};
pic[1].anim = {margin:"55px 0 0 25%", zIndex:"3"};
pic[0].anim = {margin:"75px 0 0 30%", zIndex:"2"};

pic.click(function() {
   $(this).animate(this.anim);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img src="favicon.ico" class="picAll">
<img src="favicon.ico" class="picAll">
<img src="favicon.ico" class="picAll">
<img src="favicon.ico" class="picAll">

＆＃13;

＆＃13;

＆＃13;