Jump to content
GreenSock

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

Trapti

Members
  • Posts

    93
  • Joined

  • Last visited

2 Followers

Profile Information

  • Gender
    Not Telling
  • Location
    Bengaluru
  • Interests
    SVG, animations, CSS, layouts, frontend

Recent Profile Visitors

1,598 profile views
  1. Hey, I am not sure what you mean by this "design my gsap so it works across all screen sizes". Generally what I like to do is to develop the layout with mobile first approach. And add interaction with the same approach mobile first. Because anyways there will be less interaction in mobile compared to desktop and mostly mobile interaction are common in desktop.
  2. Hey, I am Trapti, a freelance frontend developer from India. Below are my details. Portfolio: http://iamtrapti.com/ Codepen Greensock collection: https://codepen.io/collection/DqPvMe Codepen collections: https://codepen.io/tripti1410/collections/ One of my writing on SVG and animation: https://css-tricks.com/how-to-get-handwriting-animation-with-irregular-svg-strokes/ let's chat over email and discuss project further. Email: reach.trapti@gmail.com
  3. Hi, @Smithfield Just sent you an email. Looking forward to working with you
  4. Stagger value and delay value 100 doest not look good to me. Just remember it is in seconds.
  5. Hey, In the try demo Codesandbox. There is no implementation it is just react basic structure. I will suggest you share your trial with the problems so that we will understand why it is not working. I wrote procedure to go about creating this pen. You can find that here Hope it is helpful to you.
  6. Trapti

    on scroll animation

    Hi, you can use pin in scrollTrigger to make section be in the same position. If you still face problem then please create minimal Demo and will be able to help you better.
  7. Hey, I am Trapti, a freelance frontend developer from India. Below are my details. Portfolio: http://iamtrapti.com/ Codepen Greensock collection: https://codepen.io/collection/DqPvMe Codepen collections: https://codepen.io/tripti1410/collections/ One of my writing on SVG and animation: https://css-tricks.com/how-to-get-handwriting-animation-with-irregular-svg-strokes/ let's chat over email. I like to know the details of the project. Email: reach.trapti@gmail.com
  8. Trapti

    CodeSandbox Challenges 🏆

    Hi, Here is my submission. https://b2mg4r.csb.app/ From a very long time I wanted to create something like lemonade . Finally I created this demo with my very basic illustrator drawing skills 😀. So many learnings, It is always challenging to handle vertical line SVG(line is also not straight there are graphics) with scrub etc. Lemonade has two layouts one for smaller device and one for large. For this demo just created one and it is looking fine in smaller screens as well.
  9. hey, Welcome to the forum! I didn't understand your first question. For running a timeline on pin you can refer to this example https://codepen.io/GreenSock/pen/gOabMXv?editors=1010
  10. Hey, The current code stops at the last slide (the black colour section appears as a natural web page flow). Where do you want the button to be and the content you want to show is that a part of the last slide? or the normal webpage flow? Depending on what it is you can structure the code. Looks like what you are trying to do is possible.
  11. Trapti

    CodeSandbox Challenges 🏆

    Tried to recreate Apple's airpod page. It's not very clean but anyway submitting no time. https://fqfyr2.csb.app
  12. Hey, looks like you did the same mistake you did for desktop. Create path with one stroke line. check attached image for reference.
  13. I think it is working fine if you make scrollEnd around 7500. And that scrolling back can be fixed by toggle actions. You can check demo here https://codesandbox.io/s/xenodochial-wave-spfsg5?file=/src/App.js
  14. Hey, this is the simplest version of what you want. Add the card movement with motion path and it will work. https://codepen.io/tripti1410/pen/RwxLPmJ??editors=1010
  15. Hey, The HTML and CSS in that code is very messy. Clean the code have proper structure HTML CSS and then use GSAP. Also by looking at GSAP code looks like it has been used wrongly. Please do read docs. Here is how pin works in docs. https://greensock.com/docs/v3/Plugins/ScrollTrigger/pin Happy scrolling...
×