Jump to content
Search Community

dotmot

Premium
  • Posts

    7
  • Joined

  • Last visited

About dotmot

dotmot's Achievements

  1. It's so obvious i am a little embarrassed, this does cleared things up, at the end i configured a custom ease to achieve the effect i wanted. CustomEase.create("custom", "M0,0 C0,0 0.815,0.1 0.9,0.1 1,0.1 1,0.5 1,1 "); Again, Thank you very much. ScrambleTextPlugin Playground
  2. After reviewing a little more the timeline, i found that there is actually a difference of 0.26s in every character from where i `think` they should end based on the code, and where they actually end in the timeline and i don't understand why.
  3. 😅 Hi again, the response did solve my issue but after playing some more with it i found something weird, i tried calculating the duration based on the length of both arrays. const katakana = [ ... ]; const split_text = new SplitText(".message"); const split_message = ["W", "e", "l", "c", "o", "m", "e"]; function decode(args) { const timeline = gsap.timeline(args); const chars = katakana.join(""); const charsPerSecond = 1 / 3; const totalDuration = katakana.length / charsPerSecond / 60; const charDuration = totalDuration / split_message.length; for (let index = 0; index < split_message.length; index++) { const el = split_text.chars[index]; const text = split_message[index]; const duration = charDuration * (index + 1); const revealDelay = charDuration * index; timeline.to( ... ); } return timeline; } This because in the example there is some "dead" time at the end and based on the code i assumed this is what would solve this as my assumption was that there where not enough characters in the `chars` string. So i thought that would give me an exact timeline, but i still have a small amount of "dead" space at the end that i can't get rid off. Here is a basic image demonstrating how I'm picturing the final timeline Now here is the same image but with what i think as "dead" space, the final letter "e" in welcome, it has about 0.26s of time. Here is a demo: Codepen Demo
  4. This is exactly what i was intending to achieve and the explanation + the code gives me a really good example on how to use the plugin, thanks. I'm sorry for such a basic question, this is the first time trying this specific plugin.
  5. Hi there, I'm having a weird issue when trying to use ScrambleText Plugin to tween a single character, split by the SplitText plugin and searching in the forums, i found the following thread: Split Text / ScrambleText - Random Stagger, which in a comment from @Carl has the following example that i used to create this animation ( I didn't comment there as the thread is from 2015). Greensock SplitText Demo Now my problem is that while tweening the character, the tween has some "dead" time in between each character, i have tried fixing the timing using the duration of each tween, the duration of the timeline and the position of each tween in the timeline but it seems that i don't really understand how the ScrambleText Plugin really works. If anyone has any idea how i can configure this to run as if i was scrambling the text as a single word instead of each character as a regular ScrambleText Plugin tween would please, let me know. Thanks.
  6. Thanks for the clarity, Was looking for this answer when came up with this thread and since there was none before... having this response in the thread is helpful. thanks.
  7. Hello, I had the same issue and looking for a solution i found this thread. I found a work around that worked for the project, this might not work for everyone, the issue for me was that i was trying to initialize ScrollSmoother before the 'load' event which makes me think you need to initialized it after or in an event handler for the 'load' event. https://codepen.io/d0tb0x/pen/VwQqgqx Fixed https://codepen.io/d0tb0x/pen/qBxLvYQ
×
×
  • Create New...