图像拆分抽屉下拉菜单

Image Split Drawer Drop Down Menu

本文关键字：下拉菜单拆分图像更新时间：2023-09-26

我喜欢这个网站上下拉菜单的功能：https://squareup.com/

我看到这是一个非常标准的抽屉式下拉菜单，但我的问题是他们是如何将图像分割成那样的。在检查了代码之后，我很确定他们没有使用2个图像。如有任何建议或帮助，我们将不胜感激！

图像确实出现了两次。如果你运行这个选择器，你会找到它们。

$('.home-page .hero .image, .home-page .banner .image')

图像的第二部分从第一个图像被下拉框截断的地方开始，给人一种图像被一分为二的错觉。

media="screen"
@media (min-width: 718px)
.hero-image-split .hero .image {
    background-position: 50% -73px !important;
}

对于那些找不到拆分的人，当你点击导航栏上的"业务类型"或"产品"时，就会出现拆分。