Javascript 调整列的大小，同时从右侧设置元素的动画

在下面显示的代码中，我有一个帖子，里面有一个注释按钮，可以将注释框从右侧滑动到视图中。我正在将主post元素的大小从父元素的100%调整到父元素的67%（col-lg-12到col-lg-8）。尽管我试图让post元素与comment元素的入口同时移动

此外，在我的提琴中，我似乎无法修复评论如何在整个post元素中滑动，而不仅仅是其中的一部分。此外，我无法修复动画只出现而不滑入的位置，尽管滑出动画可以工作

奇怪的是，下面的代码片段不像JSFIDLE那样工作

$（'body'）。在（'click'，'comments'，函数（e）上{
var name=$（this.attr（'name'）；
var style=$（“#注释体-”+name）.prop（'class'）；
如果（样式==“col-lg-4隐藏”）{
$（“#邮政卡-”+姓名）.prop（'class'，'col-lg-8'）；
$（“#评论正文-”+名称）.show（“幻灯片”{
方向：“对”
}，1000，函数（）{
$（“#注释正文-”+名称）.prop（'class'，'col-lg-4 show'）；
});
}否则如果（样式=“col-lg-4显示”）{
$（“#注释正文-”+名称）。隐藏（“幻灯片”{
方向：“对”
}，1000，函数（）{
$（“#邮政卡-”+姓名）.prop（'class'，'col-lg-12'）；
$（“#注释正文-”+名称）.prop（'class'，'col-lg-4 hide'）；
});
}
});
.quantity{
边界半径：100px；
背景：#dc3545；
颜色：白色；
填充：1px6px；
}
span#注释{
光标：指针；
}
span#注释：悬停{
颜色：蓝色；
}
.分隔器{
位置：相对位置；
浮动：左；
身高：100%；
宽度：1px；
背景色：rgba（0,0,0,125）
}
.评论机构{
填充：0.75rem！重要；
}
.表演{
显示：块；
}
.隐藏{
显示：无；
}

通知
新职位



耶特

评论1
xddxd
评论
评论


用户


Shfashighliahgal

好的，我希望你还在看这个问题。

首先，为什么您的
节目（“幻灯片”
失败。让我们看一下这段代码


$（函数（）{
$（“#按钮1”）。在（“单击”，函数（）上）{
//淡入。（但由于优先级问题，它不会显示。）
$（“#target1”）.fadeIn（“慢”，函数（）{
//它显示在这个时间。
美元（“#target1”）.prop（“class”，“col-sm-4 show”）；
});
});
$（“#按钮2”）。在（“单击”，函数（）上）{
//淡入。
美元（“#target2”）.fadeIn（“慢”）；
});
})；
.hide{
显示：无！重要；
}
.显示无{
显示：无；
}

你好，我的名字是col-sm-4！用于显示：无！重要；
你好，我的名字是col-sm-4！用于显示：无；