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

3hvapo4f  于 2023-05-16  发布在  WordPress
关注(0)|答案(4)|浏览(244)

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

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

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
x33g5p2x

x33g5p2x1#

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

r8uurelv

r8uurelv2#

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

c9x0cxw0

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中显示动画。

nxowjjhe

nxowjjhe4#

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

相关问题