Question

我试图在单击之后为元素的所有父级设置动画。

我尝试了以下几次迭代：

$(this).parent().nextAll().animate({
  marginTop: '-=50px'
}, 500);

但我认为我的语法不正确......

父元素有一个“.useritem”类，我有一种感觉，我必须使用它，但我不知道在哪里我认为指定该项目的父＆gt;＆gt;所有这些＆gt;后移动50 px，会工作的。

任何帮助，指导或建议都会有很长的路要走，谢谢。

编辑1：HTML

我的HTML是根据服务器响应动态创建的。但是看起来像这样：

<div id='useritem' class='useritem'>
    <div id='msgnotification' class='msgnotification'>0</div>
    <img id='userimg' class='userimg' src='data/here'>
    <div id='usertxt' class='usertxt'>
        <div id='name' class='name'>User</div>
        <div id='username' class='username'></div>
    </div>
    <div id='useradd' class='useradd'><i class='fa fa-user-plus'></i></div>
</div>

有多个这些堆叠，当用户点击'useradd'时，它的宽度被动画为0，marginTop代码应该触发它下面的每个'useritem'。

Answer 1

感谢您的投入，感谢@Barmar指出我的代码/应该/有用，我再次讨论它并意识到我哪里出错了。我在一个超时中包装了marginTop代码，等待初始点击的父元素的设置动画宽度为0.但是当你再次尝试调用'this'时，元素不存在，所以代码没有'有一个初始选择器。

我通过使用.delay（）来修复此问题。现在我的初始代码正在没有超时！

再次感谢您的投入和时间。这是更新的代码：

$(this).parent().animate({
    'width': 0,
    'padding-left': 0,
    'padding-right': 0
}, 300, function() {
    $(this).next().animate({
        marginTop: '-=61px'
    }, 300);
});

Animate（this）next所有的父母用jquery？

1 个答案: