Javascript jQuery动画在一个元素上工作，而不是在另一个元素上工作

我一直在为一个应用商店制作一个模型，现在我已经构建了一个基本框架，我想开始使用jQuery使某些东西具有交互性。但是，我尝试的jQuery操作都不起作用。奇怪的是，如果我删除了所有代码，然后尝试用一个div运行jQuery操作，那么它就可以工作了。此外，如果有帮助，我正在使用括号编辑器

我的代码如下。蓝色框是在所有其他代码之前设置的div I动画，绿色框是在其余代码之后设置的div I动画。在我这边，只有蓝色div在单击时隐藏，而绿色div什么也不做

怎么了

$（文档）.ready（函数（）{
$（“.scroll menu”）。单击（函数（）{
$（“.scroll menu”）.hide（）；
});
$（“.box”）。单击（函数（）{
$（“.box”）.hide（）；
});
});
.box{
z指数：-1；
边缘顶部：20em；
位置：相对位置；
宽度：10em；
高度：20em；
背景：绿色；
左：20em
}
.滚动菜单{
背景：蓝色；
高度：300px；
宽度：500px；
保证金：自动；
}
导航{
位置：绝对位置；
身高：100%；
宽度：16em；
左：0；
排名：0；
背景:#f5；
右边框：.1em纯灰色
}
.迷你菜单{
位置：相对位置；
背景：#E3E0E6；
顶部：5em；
高度：32em
}
.顶级菜单{
位置：相对位置；
顶部：5em；
列表样式类型：无；
左边距：-1米；
}
.顶级菜单李{
位置：相对位置；
填料顶部：2米；
垫底：2米；
字体大小：1.1米；
字体系列：droidsans；
字号：；
边界半径：.5em；
右边距：.5em；
边缘顶部：.5em；
左边距：-.5em；
左：1米；
}
.顶部菜单li：悬停{
背景#725490；
}
.顶级菜单李a{
文字装饰：无；
颜色：#000000
}
.顶部菜单李：将鼠标悬停在a上{
颜色：白色；
}
.迷你菜单{
位置：相对位置；
填料顶部：2米；
垫底：2米；
字号：1em；
字体系列：droidsans；
字号：；
边界半径：.5em；
右边距：.5em；
边缘顶部：.5em；
左边距：-.5em；
左：1米；
}
.迷你菜单{
位置：相对位置；
顶部：.9em；
列表样式类型：无；
左边距：-1米；
}
.迷你菜单ul li a{
文字装饰：无；
颜色：rgb（109、52、150）；
}
.迷你菜单a：悬停{
颜色：#ab6bb1
}
.标题{
位置：绝对位置；
身高：5公分；
宽度：100%；
左：0；
排名：0；
背景：白色；
z指数：1；
边框底部：.12em纯色灰色
}
.标志{
位置：相对位置；
宽度：10em；
高度：自动；
左：2米；
顶部：下午2点
}
.app{
位置：相对；
左边距：8.8em；
边缘顶部：-.1米；
字体系列：antic；
字号：1.4em
}
.搜索{
位置：相对位置；
左：12em；
顶部：-2米；
宽度：15em；
边框：.06em纯灰色；
字体系列：antic；
字号：1.9em；
左侧填充：.5em
}
中一{
位置：相对位置；
左：11.5em；
顶部：-1.9em；
颜色：紫色；
光标：指针；
}
.图标打开{
位置：绝对位置；
顶部：5em；
光标：指针；
z指数：4；
左：19em
}
.图标打开i{
光标：指针
}
{
位置：相对位置；
背景：绿色；
高度30em；
宽度：6em；
顶部：30em；
左：50em；
边框：实心；
z指数：20；
}























应用商店
您已经给出了
框
元素a
z-index
的-1。这会将元素放置在
标记后面，使其无法单击

z-index
的作用并不明显，因此我在下面的示例中删除了它，单击后两个框都被成功隐藏


$（文档）.ready（函数（）{
$（“.scroll menu”）。单击（函数（）{
$（“.scroll menu”）.hide（）；
});
$（“.box”）。单击（函数（）{
$（“.box”）.hide（）；
});
});
.box{
边缘顶部：20em；
位置：相对位置；
宽度：10em；
高度：20em；
背景：绿色；
左：20em
}
.滚动菜单{
背景：蓝色；
高度：300px；
宽度：500px；
保证金：自动；
}
导航{
位置：绝对位置；
身高：100%；
宽度：16em；
左：0；
排名：0；
背景:#f5；
右边框：.1em纯灰色
}
.迷你菜单{
位置：相对位置；
背景：#E3E0E6；
顶部：5em；
高度：32em
}
.顶级菜单{
位置：相对位置；
顶部：5em；
列表样式类型：无；
左边距：-1米；
}
.顶级菜单李{
位置：相对位置；
填料顶部：2米；
垫底：2米；
字体大小：1.1米；
字体系列：droidsans；
字号：；
边界半径：.5em；
右边距：.5em；
边缘顶部：.5em；
左边距：-.5em；
左：1米；
}
.顶部菜单li：悬停{
背景#725490；
}
.顶级菜单李a{
文字装饰：无；
颜色：#000000
}
.顶部菜单李：将鼠标悬停在a上{
颜色：白色；
}
.迷你菜单{
位置：相对位置；
填料顶部：2米；
垫底：2米；
字号：1em；
字体系列：droidsans；
字号：；
边界半径：.5em；
右边距：.5em；
边缘顶部：.5em；
左边距：-.5em；
左：1米；
}
.迷你菜单{
位置：相对位置；
顶部：.9em；
列表样式类型：无；
左边距：-1米；
}
.迷你菜单ul li a{
文字装饰：无；
颜色：rgb（109、52、150）；
}
.迷你菜单a：悬停{
颜色：#ab6bb1
}
.标题{
位置：绝对位置；
身高：5公分；
宽度：100%；
左：0；
排名：0；
背景：白色；
z指数：1；
边框底部：.12em纯色灰色
}
.标志{
位置：相对位置；
宽度：10em；
高度：自动；
左：2米；
顶部：下午2点
}
.app{
位置：相对；
左边距：8.8em；
边缘顶部：-.1米；
字体系列：antic；
字号：1.4em
}
.搜索{
位置：相对位置；
左：12em；
顶部：-2米；
宽度：15em；
边框：.06em纯灰色；
字体系列：antic；
法罗群岛