如何解决如何告诉 barba.js 在给定路线上使用哪个过渡?
我正在处理我的投资组合,并尝试使用 barba.js。但是我在弄清楚如何做某事时遇到了麻烦:我想像这样布局我的 3 个页面:page1 -> page2 -> page3 -> page1 从右到左转换,以及 page1 -> page3 -> page2 -> page1 具有从左到右的过渡,您只需单击一下即可离开网站的任何其他页面。但我不知道如何将路由逻辑告诉 barba。
现在,过渡总是相同的(但至少它们有效,所以 barba 被正确实施)。
这是我的js代码:
barba.init({
// debug: true,transitions: [
{
name: "toRightTransition",// sync: true,from: {
namespace: [
"bio","index","projects"
]
},to: {
namespace: [
"projects","bio","index"
]
},leave(data) {
return gsap.to(data.current.container,{ duration: .3,x: window.innerWidth,ease: "power4" });
},enter(data) {
return gsap.from(data.next.container,x: -window.innerWidth,},{
name: "toLeftTransition",to: {
namespace: [
"index","projects","bio"
]
},],})
很容易看出问题出在哪里:在每个转换关键字中都有 3 个命名空间,barba 无法确定为任何给定路由应用哪个转换。
现在摆脱我的“总是一键点击”的想法使事情变得更简单(我只需要为每个转换关键字放置两个命名空间,我试过了,它奏效了),但我真的很想坚持这个方向。
对如何使这项工作有任何想法吗?
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。