Jump to content


  • Posts

  • Joined

  • Last visited

Everything posted by yulia

  1. Thanks! I have already got used to do everything with the help of greensock) and did not even check the ready-made solutions ?‍? This works perfectly: sticky-kit.js
  2. Thanks! But this property has poor support and it is not suitable for my case. I have a menu that when scrolling should stick up and be in view. But this menu should not overlap the block with the text.
  3. Hello! I need the "absolute" element to become "fixed" when scrolling 120px. After the trigger, this element must again become "absolute". But, if you scroll in the opposite direction - up from the trigger, the element must again become "fixed" until it reaches its original position. There he must again become "absolute". In my project it works only in one direction - before the trigger. And nothing in codepenio works at all Help, please
  4. Exactly what I need! Only without a button Autoplay. Added to my slider, now it works perfectly Thank you ?
  5. That is, I can not do everything within one timeline? Need to break into several timelines?
  6. Hi guys! Another question with the same slider https://codepen.io/yuliarushay/pen/EJqVEz Is it possible to add slide autoplay? How to do it? I see options only with slide navigation buttons, but not with Forward and Back buttons. Help me please)
  7. @Dipscom Jesuschrist ? what a shame! I have to do hara-kiri ... Love you ?, thanks for the help!
  8. Thanks for such a quick reply! I was really stupid ? But now, when I added new transformations to the slides, the slider again does not work
  9. Hi guys! Help again, please I can not understand why this slider does not work. Here is a simplified version codepen.io demo. By clicking on the buttons, the red area should be increased or decreased. The code ignores pauses and immediately increases the red area to the size of the second slide, and then does not respond to clicks back and forth. What am I doing wrong? :(
  10. Спасибо tweening - это супер! I made two super super cool sliders on this page using this plugin. Many thanks again for your help ❤️
  11. Hi guys! If it is interesting to look at the result, here it is
  12. Hello! One more, I hope last, question. How to add autoplay the next part in such code? I found examples only for playing different timelines :( Please, help
  13. Hello! I had another question. Now the animation is playing on the scroll and on the click forward and backward. When clicking Prev btn animation plays reverse to the label, but the employer wants the animation to start play from the label. If I change reverse() to restart(), then when I click Prev btn, the entire timeline begins playing from the very beginning not from label. Please, help! This is how the project should look like And now it looks like that, but the slides are played incorrectly on the Prev btn. They show the animation in the opposite direction, and not from the beginning of the slide/ $('#next').on('click', function() { mainPage.play(); }); $('#prev').on('click', function() { mainPage.reverse(); }); $('body').on('mousewheel DOMMouseScroll', function(e) { if (typeof e.originalEvent.detail == 'number' && e.originalEvent.detail !== 0) { if (e.originalEvent.detail > 0) { // Down mainPage.play(); } else if (e.originalEvent.detail < 0) { // Up mainPage.reverse(); } } else if (typeof e.originalEvent.wheelDelta == 'number') { if (e.originalEvent.wheelDelta < 0) { // Down mainPage.play(); } else if (e.originalEvent.wheelDelta > 0) { // Up mainPage.reverse(); } } });
  14. @mikel I do not know, in my animation all these parameters work ? But thanks for another quick and useful advice! It was all about the infinite 'repeat: -1', I changed it to a limited number of repetitions and then the whole animation worked again. Love you! ?
  15. Dear @mikel, please help me with little problem ☺️ Animation stops working, if after this block .to('#railsanimate', 0.5, { animation: 'bgscrolling .1s infinite', ease: Power4.easeOut }, '-=3.5') add this block .to('#slide6train2', 0.2, { y: 2, repeat:-1, repeatDelay:0.5, yoyo: true, ease: Power4.easeOut }, '-=0.2') Somewhere here is a mistake, but I can not understand where exactly This animation stops working .to('#result', 0.8, { transform: 'scale(1)', ease: Power4.easeOut })
  16. @mikel hello again! I've redesigned my code according to your example. And I think that I understand how to do it, so that the animation is displayed smoothly in the opposite direction (prescribe all the states in the next .to after label). BUT I still do not understand how to correctly make the scroll. Please help!
  17. Hi @mikel Thanks for the answer! I already did something like that: My task is to switch between scenes by clicking on the button up and down, and also on the mouse scroll. The important part is that I animate the same element in different scenes. The animation in my code works well only Down. If you press Up, the animation is not played backwards, but restarts. I need the Circle to increase when you press the Down button and smoothly decrease in the opposite direction when you click on the Up button. And I do not understand why the scroll works as it works Can you fix my idiotic code? Thank you in advance
  18. Thank you! My employer does not care if I know how to do it or not?? This is how the project should look like as a result (these are three scenes out of six). And I did everything. I used tweenmax and scrollmagic in my project. The problem is that the animation is gradual (elements move one by one during the scene until it reaches the trigger). As triggers, I use invisible divs equal to 100vh (I understand that this is a dumb way to solve the problem ?) But I need to run the animation simply by scrolling event (Run all the animation of one scene at a time). That's why I found codepen example that we are discussing. How to use scrollmagic without trigger elements (using only the mouse scroll-event and click) I do not know ?
  19. Thanks for the quick response! I do not know what's the reason, but to make the element appear, you need to move the screen splitter. Then there will be an element that needs to be changed in different scenes, but inside the same window. http://prntscr.com/kauzbw
  20. Hello! I'm trying to apply an animation to the same element in different time lines. But it works in jumps - without a smooth transition between the states of the element. I have a task to do animation with many elements inside one screen. I have several scenes that need to be run by scrolling or clicking on the menu. Under the link all works approximately, as it is necessary to me. One problem is that the animation does not go smoothly from the first state to the second state and then to the third. https://codepen.io/yuliarushay/pen/PBjeyN Thanks!