keeping the focus when using Flip on an input

[Alex Jester]

Hello,

I am trying to animate an input element using Flip for when the user is typing something, but when Flip is called my input is loosing the focus.

I tried calling a onComplete: function() { input.focus() }, but that doesn't work...

See the Pen KKQWOdV by jester6 (@jester6) on CodePen

Edited May 18, 2022 by Alex Jester
I added a codepen example of what I am trying to achieve

[GreenSock]

Thanks for providing a minimal demo! I wish everyone did such a great job of boiling the question down and including a succinct demo. 

 

You're doing a bunch of extra work on every key press that really isn't necessary - here's how I'd do it: 

See the Pen poaPzgp?editors=0010 by GreenSock (@GreenSock) on CodePen

 

Does that work better for you? 

[Alex Jester]

Now I understand it

It works perfectly!

It's already live, obviously the final version is more stylish here with the search field Intreb BT - Banca Transilvania

Thank you so much!

[Cassie]

What a nice effect! Thanks for sharing Alex!

[Alex Jester]

Thank you!

I'm happy to be using GSAP