wordpress Elementor -滚动“运动效果”不工作，直到窗口大小调整

3hvapo4f 于 2023-05-16 发布在 WordPress

关注(0)|答案(4)|浏览(244)

我对某些图像有滚动效果，一些放大，使用水平，垂直滚动，和一些其他效果。除非发生以下两种情况之一，否则滚动运动不会初始化：1）调整浏览器窗口的大小（宽度或高度）。2）您再次访问该页面或它被刷新。这在所有浏览器中都在发生。

**编辑：**一些滚动效果似乎已经初始化，但在它进入视口之前就触发了（这就是为什么你看不到它）。
示例视频：

如何复制：https://www.youtube.com/watch?v=U9vlteH691U
示例1：https://www.youtube.com/watch?v=a9YGIkgRF_Q
示例2：https://www.youtube.com/watch?v=JgSKObKfVOU
**注意：**如果您希望多次复制问题，则必须访问匿名页面。如果它再次开始工作，请尝试新的浏览器或新的选项卡。
受滚动影响的页面URL（大部分部分在“网页设计”下）：

https://rory-dwyer.com/hk-electrical-engineers/-笔记本电脑、电话和研究中心截图部分
https://rory-dwyer.com/simpliii/-在品牌元素和视频之间
https://rory-dwyer.com/bridge-city-ballroom-dance/-手机入口动画，网站截图
https://rory-dwyer.com/jgarloff-design/-计算机、电话和网站截图
https://rory-dwyer.com/apo11o/-手机在网页设计

我尝试过的事情：

禁用所有插件
使用股票主题
禁用页眉和页脚脚本注入
删除元素或导航和页脚部分
搜索并替换http -> https
从头开始重建页面（使用Elementor中创建的页面模板）
正在回滚Elementor版本
在活动服务器（从start）而不是本地env上从头开始重建站点
禁用所有全局模板
删除所有自定义CSS和JS

wordpress

来源：https://stackoverflow.com/questions/56979874/elementor-scrolling-motion-effects-not-working-until-window-resized

4条答案

按热度按时间

x33g5p2x1#

转到Jetpack插件中的Jetpack设置。转到“性能”选项卡。向下滚动页面并禁用“延迟加载”
Image of disabled "lazy loading" in the Jetpack plugin.

赞(0）回复(0）举报 2023-05-16

r8uurelv2#

对于那些有这个问题的人可以试试这个。
如果您使用的是Windows 10。可能你把show animations on windows关掉了。在Windows 10中从设置display settings打开它。

赞(0）回复(0）举报 2023-05-16

c9x0cxw03#

找到你的Elementor的css文件frontend.min.css并删除css的这一部分：

@media (prefers-reduced-motion:reduce) {
    .animated {
        -webkit-animation: none;
        animation: none
    }
}

这部分的css告诉浏览器，如果操作系统喜欢减少运动，则禁用动画，因此删除这部分的css将强制动画在所有操作系统上显示。如果你想保留css的这一部分，并想在你想要的一些PC上显示，那么你可以在该PC上的设置中打开动画-要在Windows 10上打开动画，请转到设置>轻松访问>显示>简化和个性化Windows，然后打开在Windows中显示动画。

赞(0）回复(0）举报 2023-05-16

nxowjjhe4#

问题在于媒体查询。勾选“粘在”选项，如果您只有“台式机和平板电脑”，则可能无法用于平板电脑额外、笔记本电脑和移动的额外。因此，如果您已激活实验以启用额外的响应屏幕，那么这就是您遇到此问题的原因。

赞(0）回复(0）举报 2023-05-16