javascript - Squarespace:仅在移动设备上禁用视差滚动

Question

示例模板:https://eamon-demo.squarespace.com/#overview-eamon

视差滚动在手机上往往会卡顿，所以我想在屏幕尺寸达到一定宽度后禁用它。到目前为止，我已经很幸运地在自定义 CSS 部分更改了较小屏幕的字体:

@media only screen and (max-width: 640px) {
   h1 { font-size: 60px; }
   h2 { font-size: 35px; }
   h3 { font-size: 30px; }
   body { font-size: 18px; }
 }

Squarespace 在“设计”选项卡中提供了一个按钮，您可以勾选以打开和关闭视差。当屏幕尺寸变小时，有没有办法通过自定义 CSS 勾选该按钮？谢谢。

Answer 1

如果 SquareSpace 阻止您禁用视差效果，您可以尝试手动覆盖 transform 属性:

@media only screen and (max-width: 640px) {
    #parallax-images .image-container img {
        transform: initial !important;
    }
}