Trapti
-
Posts
93 -
Joined
-
Last visited
2 Followers
Recent Profile Visitors
1,598 profile views
Trapti's Achievements
-
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.
-
GSAP Developer for our Company's Website
Trapti replied to Mohamed Jawher's topic in Jobs & Freelance
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 -
Freelance gsap project + full-time frontend dev roles
Trapti replied to Smithfield's topic in Jobs & Freelance
Hi, @Smithfield Just sent you an email. Looking forward to working with you -
Stagger value and delay value 100 doest not look good to me. Just remember it is in seconds.
-
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.
- 1 reply
-
- 1
-
-
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.
-
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
-
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.
- 24 comments
-
- 2
-
-
- npm-trial
- codesandbox
- (and 2 more)
-
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
-
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.
-
Tried to recreate Apple's airpod page. It's not very clean but anyway submitting no time. https://fqfyr2.csb.app
- 24 comments
-
- 3
-
-
- npm-trial
- codesandbox
- (and 2 more)
-
Hey, looks like you did the same mistake you did for desktop. Create path with one stroke line. check attached image for reference.
-
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
-
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
- 10 replies
-
- 2
-
-
- svg
- scrollmagic
- (and 2 more)
-
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...