Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...

qqignatqq

Members
  • Content Count

    40
  • Joined

  • Last visited

Community Reputation

3 Newbie

About qqignatqq

  • Rank
    Advanced Member

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. I was sitting there trying to figure it out, but as it turned out))) Really, it is. The last block is block 8, but the next block is block 9, i.e. 8+1. Thank you!
  2. I just exaggerated to make it clearer, but on the contrary, it turned out that you didn't understand))) See: https://jsfiddle.net/1pqdnm9c/ After pressing the button, the animation will start only after 1.5 seconds.
  3. Thank you, ZachSaucier!!! How to remove the delay at the very beginning of the animation? If you set "Stagger" to 5, the animation will start after 5 seconds. Is it possible to remove this delay?
  4. Hello. I wanted to make sure that the new blocks appear alternately, where each block appears before the previous one's animation ends. Or did I misunderstand the work of "stagger"? I either get the blocks to appear at the same time or after the previous block's animation is over. https://jsfiddle.net/onhmy1st/4/
  5. Hello. In addition to the animation, I want to add a style property for the class: "pointer-events: none". I did it like this: gsap.to(document.querySelector('.contfeed'),{duration:0.5, opacity:0.1, onComplete:function() {document.querySelector('.contfeed').style.pointerEvents = "none";} }) It works, but I wanted to ask, is this the right decision?
  6. I tried both js and css animate. In both cases, the second circle makes a very large circle. You need to hover and wait a little bit. At some point you will see it https://jsfiddle.net/a7zge5mh/
  7. Hello. https://jsfiddle.net/sh6kbv1u/2/ I'm making you my cursor. You need to start rotating around your axis when you hover the circle "C2" (dotted line). When I do a transform rotate, it starts to rotate around the reference point, and changing the transform-origin does not help.
  8. Thanks to Mikel, but I had a little different. Here's how it's done with me. When you move the mouse, the XY position changes: https://jsfiddle.net/6q0dgp28/
  9. Thank you so much for the hint, but I'm not going to be able to use this option, because I also animate X and Y in addition to Scale when I move the mouse. In any case, thank you. I used your decision in another part of the code, it helped me a lot. I have a question. Is there any way you can use it for the whole function "overwrite:true" and for a certain part "overwrite:false". I'm asking because I stopped working on this piece of code: https://jsfiddle.net/2b9fgxL0/ . Opacity doesn't work for some reason... If overwrite is removed, everything will be fine.
  10. Hello. After the update began to work strange animation. When pointing at a block, the image should approach, and when the mouse is removed - it should take its original position, but for some reason in the new gsap it does not work. OlD: https://jsfiddle.net/v07h348a/ NEW: https://jsfiddle.net/ads2v47q/
  11. Thank you so much for your help! You have helped me very much! I will use your example from jsfidddle. By the way, congratulations on your 1000 likes! Mine was a thousand))))
  12. Hello. How to make the animation run without waiting for the end of the previous animation? I want to do my own animation as I scroll through the page and I need the blocks to appear alternately. Here is my code:https://jsfiddle.net/h7qp5m64/1/ I thought that if I prescribed a negative start to the animation, it would work the way it should, but I didn't really get it right. In the beginning the animation goes very quickly. To see how it should work, you need to quickly scroll down the page and then there will be a normal animation.
  13. document.querySelectorAll(".anyclass")[2] ?
  14. If there are several identical classes, can we refer to, for example, the third one? <div class="anyclass">NOT THIS</div> <div class="anyclass">NOT THIS</div> <div class="anyclass">---THIS---</div> <div class="anyclass">NOT THIS</div>
×