谷仓(B)
# 1
你好,
试图实现这个
在webflow中通过将它应用到一个现有的文本块类
但这行不通
代码被嵌入到与文本块相同的div中
我尝试了应用原始的方式,在文本中包含文本字符串:{value: " "}
但也没有成功
任何防止新手的指示都是感激的
谷仓(B)
# 5
要调试排除的Scrolltrigger函数,仍然不能输入
从控制台运行调试,但没有显示本节的任何内容,
如果有人有任何线索,我会非常感激。
abirana(Abi Rana |交互式Web Developer)
# 6
哦,好的,所以你想获得文本的页面,然后你的代码上面应该肯定工作,我也测试了自己。
顺便问一下,你把整个JS代码放好了吗?
你有没有给那个typing_text在文本所在的元素上?因为你在使用getElementById元素应该有ID。元素也应该包含这些文本。
如果你已经考虑了这两个,它应该是可行的。请检查一下,如果有什么情况请告诉我。
const myTextElement = document.getElementById("typing_text");gsap.to(”。打字_text", { text: { value: myTextElement.innerText }, scrollTrigger: { trigger: ".section-typing_text", pin: ".typing_text-heading", start: "center center", end: "center top", scrub: true, markers: true } });
我们只有一个选择文本我们也可以这样做。
文本:myTextElement.innerText,
1像
再次感谢@abirana
是的,我已经定义了typing_text的ID
为
触发(".section-typing_text)因为我有一个combo类,为了简化,我使用了一个id:
信息
我有在名称下运行的文本块打字它有两个内联类typing_text而且光标
光标闪烁功能有效,但其他功能无效
下面是代码
typing和scrolltrigger函数仍然不能工作
问题在第622行:
文字:myTextElement.innerText
如果我使用,结束时
我收到这条信息
如果我使用;在行末,我得到了这样的消息:
如果我不使用我得到“意外标识符”在第623行
其余的错误与脚本无关,因为它从580行开始
我已经没有线索了,如果有人遇到这样的人,请告诉我一个像这样的新手
webflow不识别嵌套函数还是什么?
谷仓(B)
# 9
也知道如何运行脚本后HTML加载?
我已经尝试添加整个代码到webflow主设置自定义代码
页脚部分没有
异步函数
但除了别针功能还是不行
根据控制台,没有脚本相关的bug
更新:
我在主设置的页脚部分尝试了9种不同的方法
*第一个没有bug,除了引脚功能不工作
*3: Uncaught TypeError:无法读取null属性(读取' innerText ')
< >脚本gsap.to(”。typing_text", { text: myTextElement.innerText, scrollTrigger: { trigger: "#info", pin: ".typing", start: "center center", end: "center top", scrub: true, } } );
也尝试了延迟和稍后的异步包括在前面的设置
*1: Uncaught ReferenceError: gsap未定义
*2: Uncaught ReferenceError: gsap没有定义
*3: Uncaught ReferenceError: gsap没有定义
也试着扭转
同样的结果:Uncaught ReferenceError: gsap没有定义
只是提醒一下,这是GSAP论坛上的一个重复帖子。我们将让你在这里处理它,因为控制台日志没有启动-所以这似乎更多地与不理解如何在webflow中运行JS而不是GSAP有关
abirana(Abi Rana |交互式Web Developer)
# 13
嗨@barn
这里有相当多的东西您应该注意。
首先,如果你检查我CodePen你应该知道typing_text元素开始时没有任何文本。但是你从相同的文本开始,所以它不会动画。
在上一个脚本中,你提到了id这里应该是class。
另一件事是,我举的是垂直滚动的例子而你的实现是水平滚动的,这也是它不能工作的原因。
为此,你应该添加另一行ScrollTrigger设置:水平:真
不要只是复制粘贴代码,请尝试理解代码。如果你不注意,连一个都不见了”逗号,足以让人头疼。
abirana(Abi Rana |交互式Web Developer)
# 14
1像
谷仓(B)
# 15
谢谢@abirana观察你的webflow代码一定程度上是有意义的文本输入源必须与输出不同,所以如果我必须使用2个不同的文本块
abirana(Abi Rana |交互式Web Developer)
# 16
太好了,我希望你现在能成功。
让你们知道,还有一种更好的方法用ScrollTrigger实现水平滚动但这需要更多的工作。如果你想,你应该在这里查看更多信息
谷仓(B)
# 17
你的代码正在工作,然而我的网站方向是垂直的,它可能看起来水平,因为我还没有整理出流体设计
它如何水平打字?
我使用相同的代码和相同的风格设置在Webflow
谷仓(B)
# 18
谢谢@abirana,我试图理解,因此,只是澄清什么是正确的方式引用id在webflow脚本是它开始#我知道这门课是从一个点开始的
更新:排序
必须定义最小和最大字符吗
谷仓(B)
# 19
嗨@abirana是否可以使用此脚本同时进行垂直和水平滚动
因为我有网站,有bof和垂直,它工作,但当我试图应用它的水平,它不
两边都试过了
水平:没错,
而且
/ /水平:没错,
两者都有相同的结果,截图显示
垂直滚动起作用了
在哪里
触发:“信息”,
在标题中
但是当我尝试添加另一个组合类“about”到头部
这可能是它无法识别的水平滚动的触发点
如何可能有多个ScrollTriggers?任何建议表示赞赏
阅读链接:Webflow - k∞
连接:Webflow - k∞