Kapaluika

Yes, indeed this is what I wanted. Thanks so much, your code is amazing. But I don't understand one detail: .to('.line01', {x: -9, stroke:'#000000'}, '<') < - what is it? And where can I read about it?

Perhaps this is due to the fact that I partially switched to version 3. Since I started on an early version and there was no such problem. I recorded a small video of what result I want to achieve 3yf2DyiK2i.mp4

Thank you ZachSaucier for your answer, you are the one who always answers questions:) I think you misunderstood me. The problem is that after clicking the button again(namely, when it turns from a cross into two lines), they are in the middle of each other in the position: .to('.line02',0.4,{x: 9, stroke:'#000000'},0) .to('.line01',0.4,{x: -9, stroke:'#000000'},0) But I need them to return to the position: .to('.line02',0.4,{x: 0, stroke:'#000000'},0) .to('.line01',0.4,{x: 0, stroke:'#000000'},0) I do not know how to do this, I will be happy to wait for your response

Hi everyone, I ran into a problem. I made a small click-and-hover animation. When you hover over the hamburger, the two lines become in the middle. When you click on a hamburger, it turns into a cross. When you click again, the reverse occurs, but the hamburger does not become the "set" value but moves to the last position when hovering. How to make two lines go to the original position, which is specified in "set". Please don't throw stones, I'm still a novice.

I created a new pen on CodePen I showed there how animation should be, but the code is very bad and it can't be used together with mouseenter and mouseleave.

I want these lines to move to the center when the button is clicked, but I don't know how to do it:(

I'm new to jQuery and JavaScript, don't judge strictly. I wrote a small script to animate the display of tabs. And I decided to add animation when hovering and clicking on the button itself. But I can't figure out how to do it. Made an animation when hovering through mouseenter and mouseleave. I want these lines to move to the center of the word when you click them, and when you click another button in active mode, they leave the old one and appear on the new one. I uploaded the full code to CodePen