Javascript 单击div向下移动

我想做一些类似于-当我按下About时，会在主div上显示覆盖，其中包含文本About。现在，当我单击时，div将显示，但它将向下移动

particles js

div。我不想移动该div，但我想在该粒子上显示（全屏覆盖，不透明度为50%）

$（“.about”）。单击（函数（）{
$（“.main”）.fadeToggle（'500'）；
$（“.aboutText”）.fadeToggle（'500'）；
});
@导入url（'https://fonts.googleapis.com/css?family=Open+Sans:400800’；
身体{
背景：#1d；
字体系列：“蒙特塞拉特”，无衬线；
字体大小：100%；
保证金：0自动；
填充：0；
溢出x：隐藏；
}
.集装箱{
宽度：100%；
保证金：0自动；
填充：0；
}
#粒子js{
高度：100vh；
宽度：100%；
背景颜色：绿色；
}
#关于{
高度：100vh；
背景颜色：米色；
}
h1.main{
颜色：白色；
位置：绝对位置；
填充：0；
保证金：0自动；
最高：50%；
显示：内联块；
左：50%；
文本对齐：居中；
字体大小：4.5em；
转换：翻译（-50%，-50%）；
}
氢{
颜色：白色；
位置：绝对位置；
最高：60%；
左：5%；
字号：2em；
}
a、 标志{
文字装饰：无；
颜色：#2ecc71；
}
斯潘·霍姆{
位置：绝对位置；
最高：50%；
右：1%；
变换：旋转（90度）；
颜色：#fff；
字号：1em；
}
a、 关于{
位置：绝对位置；
最高：50%；
左：1%；
变换：旋转（270度）；
颜色：#fff；
字号：1em；
}
a、 关于{
文字装饰：无；
颜色：#fff；
}
@仅介质屏幕和（最大宽度：500px）{
.场地导航a{
填料：2米；
字号：1.5em；
}
}
.文本{
颜色：#fff；
位置：相对位置；
最高：50%；
左：10%；
背景色：#000；
显示：无；
}
a、 关于：悬停{
颜色：#2ecc71；
}
.大约{
背景色：#000；
宽度：100%；
高度：100vh；
背景尺寸：封面；
不透明度：0.5；
位置：相对位置；
显示：无；
}
.aboutText--打开{
背景色：#000；
宽度：100%；
高度：100vh；
背景尺寸：封面；
不透明度：0.5；
位置：相对位置；
}

SSS

文本
家
这就是你想要做的吗？单击时是否显示关于文本


$（“.about”）。单击（函数（）{
$（“#粒子js”）.toggleClass（“隐藏”）
$（“.aboutText”）.toggleClass（“隐藏”）
});
@导入url（'https://fonts.googleapis.com/css?family=Open+Sans:400800’；
身体{
背景：#1d；
字体系列：“蒙特塞拉特”，无衬线；
字体大小：100%；
保证金：0自动；
填充：0；
溢出x：隐藏；
}
.集装箱{
宽度：100%；
保证金：0自动；
填充：0；
}
#粒子js{
高度：100vh；
宽度：100%；
背景颜色：绿色；
}
#关于{
高度：100vh；
背景颜色：米色；
}
h1.main{
颜色：白色；
位置：绝对位置；
填充：0；
保证金：0自动；
最高：50%；
显示：内联块；
左：50%；
文本对齐：居中；
字体大小：4.5em；
转换：翻译（-50%，-50%）；
}
氢{
颜色：白色；
位置：绝对位置；
最高：60%；
左：5%；
字号：2em；
}
a、 标志{
文字装饰：无；
颜色：#2ecc71；
}
斯潘·霍姆{
位置：绝对位置；
最高：50%；
右：1%；
变换：旋转（90度）；
颜色：#fff；
字号：1em；
}
a、 关于{
位置：绝对位置；
最高：50%；
左：1%；
变换：旋转（270度）；
颜色：#fff；
字号：1em；
}
a、 关于{
文字装饰：无；
颜色：#fff；
}
@仅介质屏幕和（最大宽度：500px）{
.场地导航a{
填料：2米；
字号：1.5em；
}
}
.文本{
颜色：#fff；
位置：相对位置；
最高：50%；
左：10%；
背景色：#000；
}
a、 关于：悬停{
颜色：#2ecc71；
}
.大约{
背景色：#000；
宽度：100%；
高度：100vh；
背景尺寸：封面；
不透明度：0.5；
位置：相对位置；
}
.隐藏{
显示：无；
}
.aboutText--打开{
背景色：#000；
宽度：100%；
高度：100vh；
背景尺寸：封面；
不透明度：0.5；
位置：相对位置；
}

SSS

文本
家
Sidenote，您正在加载jquery和jquery.min您的问题不清楚，可以重新措辞吗？我理解的是，您希望将aboutText div显示在平面外，而粒子js div应该位于其右侧位置？我希望在aboutText上的粒子上覆盖50%的不透明度。所以当我点击“关于它的链接”时，它会显示“关于粒子上方的文本”div，后面是粒子。