Jump to content
GreenSock

ALTIMAX

BusinessGreen
  • Posts

    13
  • Joined

  • Last visited

About ALTIMAX

Recent Profile Visitors

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

ALTIMAX's Achievements

  1. ALTIMAX

    wiggle path of SVG

    So i reset the file to your previous answer, I have a little gap but it's ok (the mouse are inside the svg for firefox and chrome). Thank you again for your help !
  2. ALTIMAX

    wiggle path of SVG

    Nothing, I have updated (little clean) my Pen : https://codepen.io/Pratrax/pen/abWavee
  3. ALTIMAX

    wiggle path of SVG

    It does not work on my computer ... I use Brave(V1.27.109) and firefox (v90). Codepen works on Brave but not Firefox now :'( Thank you
  4. ALTIMAX

    wiggle path of SVG

    I have another question, in fact, all it's ok for Firefox, because it put transform : translate, or chrome use matrix and I have an offset. I try force3d without success. I edited my codepen : https://codepen.io/Pratrax/pen/abWavee Best regards
  5. ALTIMAX

    wiggle path of SVG

    Thank you so much ! It perfectly works !
  6. ALTIMAX

    wiggle path of SVG

    Yes, I edit my post, so the wiggle it's just to ugly...
  7. ALTIMAX

    wiggle path of SVG

    Hello everyone, Sorry for dig up the post, I try to move with clientX and clientY you're blue wiggle, without any success ... How is that possible to move it ? Thank you for your futur reply Best regards https://codepen.io/Pratrax/pen/abWavee
  8. Hey Zach ! Thank you for your answer, it's ok to convert to Gsap3 but can the code be optimised with gsap only (no js math)? Best regards Zach
  9. Hello, I am asking for your help because I found this codepen on the internet. The code works but I would like to know if there is another method using jQuery and Gsap (not TweenMax). PS: I only want the effect on the text with the mouse Thank you for your help. Best regards
  10. ALTIMAX

    Bug resize window

    hey Zach, you are very fast! Thanks a lot, it works but I have another problem coming up, it's for the responsive. As you can see on the video, it doesn't take the new width/height of my div. When I refresh, it's ok ... How do I do it ? Thanks again for your help. Best regards, Resize-2.mp4
  11. ALTIMAX

    Bug resize window

    Hello, I have a problem with the window resizing. When I open my website, I scroll, everything works. When I resize my web browser window, it generates a bug when I scroll again. Indeed, Gsap stays with the size of my element + browser window before resizing. I made a small video to show you my bug when I resize + scroll again. Thanks to you. Best regards $(document).ready(function() { let $movie = $('.Video-container'); if ($movie.length > 0) { movie(); } }); function movie() { gsap.set(".Video-pic", { xPercent: 0, yPercent: 0 }); gsap.to(".Video-pic", { width: '100vw', height: '100vh', scrollTrigger: { markers: true, pin: ".Video-container", start: "top top", scrub: true } }); } <div class="Video"> <div class="Video-container"> <picture class="Video-pic container"> <img class="Video-img" src="/images_contenu/conseiller.jpg" alt=""> </picture> </div> </div> .container { margin: 0 auto; padding: 0 1.5rem; width: calc(100% - 4rem); @include media(">=small") { width: 72rem; } @include media(">=medium") { width: 96rem; } @include media(">=large") { width: 114rem; } @include media(">=extra-large") { width: 120rem; } } .Video{ position: relative; margin: 15rem auto 0 auto; z-index: 2; &-container{ position: relative; display: flex; justify-content: center; align-items: center; width: 100%; top: 0; } &-pic{ display: flex; justify-content: center; align-items: center; padding: 0; position: relative; top: 0; } &-img{ width: 100%; height: 100%; object-fit: cover; } } resize bug.mp4
  12. Hi ZachSaucier , thanks for your help ! I hadn't thought about the call function, it did the job well
  13. Hi all, I have a simple timeline (here just a little part) with some tweens, one of them have an onComplete callback. mobileTimeline = gsap.timeline({paused: true}) .to(pictures, {opacity: 0, duration: 0.5, onComplete: switchPic}) .to(pictures, {opacity: 1, duration: 0.5}, ">"); function switchPic(){ let picA = pictureA.find('.HomeIntro-img').attr('src'); let picB = pictureB.find('.HomeIntro-img').attr('src'); pictureA.find('.HomeIntro-img').attr('src', picB); pictureB.find('.HomeIntro-img').attr('src', picA); } Everythings runs well when i trigger mobileTimeline.play(), but i want to trigger the event callback on mobileTimeline.reverse() too. I have tried the onReverseComplete callback on the tween but it didn't triggered.. Someone can explain me how to proceed ? Thanks !
×