问题标签 [barbajs]

我正在为 WP 开发自定义主题，需要进行类似于本网站https://www.instrument.com/的页面转换

对于这些目的， Barba.js似乎是一个完美的解决方案。但是，整个 DOM 树总是会刷新，而不仅仅是内容。

这是我所拥有的：

header.php

footer.php

在正文标记关闭之前注入的主脚本文件中，我有以下内容：

当我单击导航栏中的链接时，会出现leave控制台输出，但随后会再次加载整个页面，就好像 Barba 从未出现过一样。我从来没有看到enter输出。

是否可以首先将 Barba 与 WP 一起使用？如果是这样，我做错了什么？

我感谢您的帮助。

我在 wordpress 中遇到了 barba.js 的常见问题。我正在解决这个问题：https ://codepen.io/dan-oc/pen/gvLaGB和这个https://barbajs.org/demo/nextprev/index.html例子。问题是，页面转换后页面设计被破坏，甚至前一页也被破坏。我知道在 stackoverflow 和其他论坛中有很多关于这个问题的主题，并且有一些答案。我试图从中受益，结果总是一样的。我不知道有什么问题。首先我认为，可能是页脚和头部中的脚本和样式文件在转换后尚未加载，但我看到页面转换后已加载。那么如果在转换后加载所有内容，那么问题是什么。谁能帮帮我。我的 javascript 知识很薄弱，而且我是 ajax 技术的新手。感谢您的关注。

我第一次尝试使用 Barba.js。我基本上只希望每个页面都有一个转换（转换 div 显示data.next.namespace幻灯片进出）。唯一的例外是在第一页加载时仅出现一次的预加载屏幕。

once钩子有效，但我在过渡default时遇到问题。当我单击一个链接时，DevTools 中的控制台没有显示错误，但加载的页面始终是当前页面。我使用 global barba.hooks.enterto console.log nextdata.next.namespace并且它工作了几分之一秒，然后立即重新加载当前页面。（下面的代码）

我不知道我的代码有什么问题，非常感谢您的宝贵帮助。

提前致谢！

我有 Barba.js 在我正在开发的网站上工作，我已经调试了一些其他问题，但我注意到我的 jS 没有在页面之间重新初始化，这不是预期的行为。请在下面查看我的代码（出于 DRY 的目的，我删除了我的实际网站内容）：

索引.html：

pageTransitions.js：

据我了解，问题是每次将新页面的内容加载到 DOM 中时，它都不会重新初始化我的其他脚本。有什么想法可以正确地重新启动我的其他脚本吗？

我正在使用 barba.js 通过 GSAP 创建平滑的页面转换。最初我在重新初始化我的 jS 时遇到了问题，但现在可以正常工作（已调试）。但是，我对 html5 视频有疑问-单击缩略图会以视频模式打开视频的全屏版本，在干净的页面加载时，这不会自动播放，并且具有链接到我自己的 jS 文件的自定义控件-默认控件是隐藏的。

出于某种原因，当我使用 PJAX 切换页面并重新加载页面时，会显示默认控件，并且我的自定义视频播放器控件不再控制有问题的视频。奇怪的是他们仍然播放音频，但视频看起来被启用了控件的原始文件覆盖，我可以同时播放两个视频并听到两个视频，但只能看到一个视频。

基本上，PJAX 和 html5 视频之间似乎不兼容，这是我的 barba.js，它控制 PJAX 转换（注意我测试过的脚本的重新初始化并且可以工作）：

然后是模态的html：

然后视频模式 jS 可以完美地在整个页面重新加载时运行，而不是通过 PJAX：

我在这里想念什么？

我正在尝试编写一个脚本来更新 JS 中以冒号分隔的参数的 URL，因为页面内容是通过 AJAX 加载的。

文档结构是这样的：

仅#content由 AJAX 库更新，所有链接都需要“手动”更改。

例如：如果我单击过滤器链接https://example.com/page/topic:foo，如尚不存在，并在它们不存在时将其删除。https://example.com/page/format:barhttps://example.com/page/topic:foo/format:bar

我以为我已经通过映射对象数组中的所有参数来解决它，然后使用我在 StackOverflow 上找到的片段进行合并并返回字符串，但我的逻辑似乎有错误，我无法确定它……</p>

这是我尝试过的codepen的链接。

https://codepen.io/moevbiz/pen/OJRNNex?editors=0011

感谢您的任何提示或建议……</p>

我正在使用带有barba.js的GSAP来创建平滑的页面转换，但我有一个无法调试的错误。转换本身按预期工作，页面淡入淡出，发生 pjax 调用，页面内容更新，然后新页面内容淡入。

但是，一旦页面淡入，如果我通过转到另一个页面来重复转换，淡入不透明度会在达到其最终值“1”之前卡住。我已经跨页面对此进行了测试，无论使用哪个进入/离开页面，第一个转换总是正确的。

我的问题是为什么？这是我使用 GSAP 的 barba.js：

请参阅下面的控制台图像，显示在第二页加载时随机百分比停止不透明度。

有没有人遇到过这种情况，有已知的解决方案吗？

每次我在 script.js 中的 glide js 东西在刷新项目页面后被加载并且在访问时不会加载。

这是我的代码的链接 https://codepen.io/nileshaggarwal/pen/ZEpJMrJ

上面的代码是 glide.js 部分，在访问项目页面链接时需要执行。并且 javascript 文件只需要与 html 文件一起执行。包含指向 javascript 文件、css 文件和完整 html 文件的链接。

我正在努力使用 barba js v2。ajaxtransition 后，我的 main.js 脚本停止工作。我想以某种方式重新启动这个脚本......

我有这样简单的 barba 过渡->

在</body>标签的 and 我有

在这个 main-dist.js 脚本中，还导入了几个其他脚本，例如显示当前日期的函数。

当我第一次进入该页面时，一切正常，但是当我进入另一个页面并返回应显示当前日期的页面时，由于脚本未初始化，日期未显示。它仅在加载时初始化，而不是在 ajaxload 时初始化。

所以我的障碍是在 ajaxload 上以某种方式重新初始化这个脚本。

我正在尝试设置谷歌分析和 Barba.js。我在页脚中有这个分析代码；见下文。我正在使用“./analytics”中的“import { analytics};”导出代码 使用下面的代码。

我正在使用'barba.hooks.enter'。当我单击每次单击时，我可以在控制台日志中看到每个页面，但谷歌分析没有记录页面链接。有人可以指出代码的问题吗？

谢谢

从“./analytics”导入“导入{分析}；” 在 app.js 中。我正在使用 Webpack！

在 app.js 中