Javascript 淡入效果不起作用（引导4）

我已经设法在我的索引页上添加了一个按字母顺序排列的过滤器。 我的代码受到以下Bootsnip的启发：。此Bootsnip基于Bootstrap 3.3

我的索引页基于Bootstrap4Beta

当我点击一封信来过滤相册时，为什么没有淡入淡出效果呢

更新：

我已经根据下面的答案更新了代码。我现在使用的是引导卡，但当我应用过滤器时，我仍然坚持使用动画：没有褪色或平滑效果

这是我的新小提琴：

$（文档）.ready（函数（）{
$（“.filter按钮”）。单击（函数（）{
var值=$（this.attr（'data-filter'）；
如果（值=“全部”）{
$（'.filter'）.show（'1000'）；
}
否则{
$（“.filter”）.not（'.+value）.hide（'3000'）；
$（'.filter'）.filter（'.+value）.show（'3000'）；
}
});
if（$（“.filter按钮”）.removeClass（“活动”））{
$（此）.removeClass（“活动”）；
}
$（此）.addClass（“活动”）；
});

身体{
字体系列：Arial；
字号：14pt；
字体大小：粗体；
颜色：#cc6110；
背景色：#e3e0ce；/*Nenesse 8/17/2017：新颜色*/
背景图片：url（images/background woodenfloor.jpg）；/*Nenesse 8/16/2017：新背景图片*/
}
.头衔{
字号：24pt；
字体大小：粗体；
颜色：#cc6110；/*Nenesse 8/16/2017：新颜色*/
}
img{
边界：0；
}
a{
字号：14pt；
颜色：#285e80；/*Nenesse 8/16/2017：新颜色取代#FFFFFF*/
文字装饰：无；
}
a:悬停{
文字装饰：下划线；
颜色：#cc6110；
}
a:悬停img#拇指图像{
文字装饰：无；
}
.artist{/*Nenesse 8/16/2017：不同颜色的新课程*/
颜色：285e80；
字号：12号；
字体大小：粗体；
}
.专辑{/*Nenesse 8/16/2017：不同颜色的新课程*/
颜色：#cc6110；
字号：10pt；
字体大小：粗体；
}
.导航线{
填充：2px0px；
}
.btn信息{
背景色：#285e80；
边框颜色：#cc6110；
}
.btn信息：悬停{
背景色：#cc6110；
边框颜色：#285e80；
}
.过滤器按钮{
字号：18px；
边框：1px实心#cc6110；
边界半径：5px；
文本对齐：居中；
颜色：#cc6110；
边缘底部：30px；
}
.过滤器按钮：悬停{
字号：18px；
边框：1px实心#cc6110；
边界半径：5px；
文本对齐：居中；
颜色：#ffffff；
背景色：#285e80；
}
.btn默认值：活动。筛选器按钮：活动{
背景色：#285e80；
颜色：白色；
}
.卡片{
边缘顶部：30px；
}

专辑列表
专辑列表
全部的
A.
B
C
D
E
F
G
H
我
J
K
L
M
N
O
P
Q
R
s
T
U
v
W
X
Y
Z

博拉
南非语地下室-未发布的扩展版本-光盘1
博拉
南非语地下室-未发布的扩展版本-光盘2
杰普特é；纪尧姆|迪菲斯
鹿特丹之旅

劳伦特·加尼尔
La主盒-光盘4
Laurent Garnier | Traumer | Bambounou
La主盒-光盘3
Laurent Garnier | Traumer |丈夫
La主盒-光盘5
劳伦特·加尼尔（Laurent Garnier | Uner | Marc Romboy）
La主盒-光盘1
Laurent Garnier | Voiski |复制粘贴灵魂
La主盒-光盘2
穆德曼
Dj Kicks-光盘1

穆德曼
Dj Kicks-光盘2

穆德曼
Dj Kicks-光盘3
Svreca | Lucy | Alexey Volkov | Rø；卫生署å；D
哈加加坦混音版

我们的故事
北极星/静默空间

巴亚拉公民
新黎明女神

巴亚拉公民
Mofo CongoiMetric
贵族
女孩与变色龙-光盘1
贵族
女孩与变色龙-光盘2
下东区管道| Joe Claussell
Joaquin Joe Claussell混音



18/09/2017 00:18:40
技术支持
&；JHR增强详细信息模板


我从您使用的模板中复制了代码并将其破坏