Question

我正在构建一个移动项目，该项目包含许多模块，这些模块的元素定位为固定。面临的问题仅限于在iOS上运行的浏览器。确切的问题是，每当我滚动页面的主体（例如底部工具栏）固定时，整个固定元素分别与滚动一起移动，一旦滚动完全结束，那么只有它回到它的指定地点。

我已经为页面正文提供了相对的css规则。请帮助，因为这只发生在iOS上。

 .add-to-block {
    background: #fff;
    position: fixed;
    bottom: 0px;
    right: 0px;
    display: block;
    height: auto;
    width: 100%;
    *(inner content element) {
        inner content element styling...
     }
}

Answer 1

请尝试此操作，来源here

@echo off

set /a ans=%1+%2

for %%n in (4 8 16 32) do if %ans% LEQ %%n GOTO :%%n

echo %ans% is greater than 32
goto :EOF

:4
echo # Host Req     #   Mask   #       Netmask      #   Max Supported #
echo   %ans%            /30            255.255.255.252      4
echo.
goto :EOF

:8
echo # Host Req     #   Mask   #       Netmask      #   Max Supported #
echo   %ans%            /29            255.255.255.248      8
echo.
goto :EOF

:16
echo # Host Req     #   Mask   #       Netmask      #   Max Supported #
echo   %ans%            /28            255.255.255.240      16
echo.
goto :EOF

:32
echo # Host Req     #   Mask   #       Netmask      #   Max Supported #
echo   %ans%            /27            255.255.255.224      32
echo.
goto :EOF

Answer 2

对此没有一个简单的答案，因为它已经在ios上存在一段时间的已知问题（据说在ios8中已修复）但是这为您提供了几种方法来解决它：https://remysharp.com/2012/05/24/issues-with-position-fixed-scrolling-on-ios它详细说明了所有在ios设备上修复位置的问题以及在需要使用它时可能的修复方法。

Answer 3

为 height: 100% 元素添加 overflow: auto 和 fixed。

完整示例位于 https://codepen.io/astnt/pen/ExgOqeX

Answer 4

Safari使您可以滚动到固定div的范围之外，从而可以产生很好的弹力效果。但是，当您滚动到该点时，如果有可滚动的容器，则随后的触摸事件将移交给该容器。因此，滚动不会执行任何操作，直到控制权移交给固定的div。

解决方法是为容器div提供overflow-y: hidden样式，以使Safari不会碰到麻烦，而我们将继续与固定div交互。

Answer 5

尽管我在滚动div中具有固定元素（并将其向上移动），在父元素上没有任何变换或其他创建图层的属性（并在固定元素上创建了一个图层），但没有一个提议的解决方案对我有用元素）等。

我的解决方案是将固定元素更改为position: sticky;

在iOS上的位置固定元素上滚动问题

5 个答案: