首页 > 解决方案 > CSS Sticky 位置在移动设备上无法正常工作

问题描述

我的 OpenCart (2.3.0.2) 网站上有一个带有粘性购物车按钮的按钮。这个想法是只有一个页面可供订购(只有几个三明治,不需要类别和产品页面)所以我添加了一个购物车按钮,该按钮位于页面的右上角:

#cart {
    position: fixed;
    top: 0;
    right: 0;
}

这适用于桌面网站,但在移动设备上滚动时我得到以下信息:手机上的按钮 正如您在右上角看到的那样,按钮向上滚动了一点。在此之后,按钮随页面滚动。

是否有任何解决此问题的方法?

标签: htmlcssopencartopencart2.xopencart2.3

解决方案


这与chrome mobile 上的 Position fixed 导致元素在向上/向下滚动时移动的问题有关

解决方案:

<meta name="viewport" content="minimum-scale=1">

推荐阅读