Topics

Kevin Powell - Community•2y ago

How to create slider using GSAP

HI friends, I am struggling to create the slider used in https://www.twopointo.film/ this site but using gsap i have codepen and everything setup if anyone would help me out in this would be very great ✨ https://codepen.io/raj-shukla/pen/poKoNbY

We’re the new kids on the block, here to shake things up. Never settling for average.

9 Replies

MarkBoots•2y ago

you say you are struggling, but you show us a clean template. What did you try, what does not work. I don't think anyone is just gonna try and build it from scratch for you

Jochem•2y ago

not to put too fine a point on it, but uh... that comment really makes this look like a homework assignment?

baba•2y ago

basically it is something like someone is trying to test your skills that is what my younger brother is trying to do so i came here to get some tips or some examples which can help me out to complete this thing i not want to be spoonfeed but somethings which might help to complete this i only have few hours left to prove @MarkBoots @jochemm

Jochem•2y ago

If you take a look at the css property scrollbehavior, you can use that to get the smooth scrolling https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-behavior

scroll-behavior - CSS: Cascading Style Sheets | MDN

The scroll-behavior CSS property sets the behavior for a scrolling box when scrolling is triggered by the navigation or CSSOM scrolling APIs.

Jochem•2y ago

as for scrolling to things, I think you can use anchors (so an href="#secondvideo" to link to an element with id="secondvideo"

WHIZZBBIG•2y ago

well the site that is referenced there is using keen-slider

WHIZZBBIG•2y ago

it was pretty easy to implement https://codesandbox.io/s/infinite-clickable-autoloop-slider-ipdk4q

CodeSandbox

infinite-clickable-autoloop-slider - CodeSandbox

infinite-clickable-autoloop-slider by whizzbbig

WHIZZBBIG•2y ago

with that

baba•2y ago

thanks

Kevin Powell - Community Join

A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.

34KMembers

View on Discord

Want results from more Discord servers?

Add your server

More Posts

webp images not showing up in github pagesI've converted jpg to webp for optimizing images, but now images in GitHub pages are not showing up.Trying to increment this button but struggling to find the right resource for onclickhttps://codepen.io/Laing91/pen/rNKNaQb I'm trying to create an onclick for the buttons, so when I p Difference from functions and arrow functions?Been watching a few tutorials lately for normal JS and React and see people use functions and arrow Shortening JqueryI have a specific on click event where if i click on the first image, the first row appears on a dif I want to copy this STRIPE’s embeddable pricing table feature.FOR INFO: There is a stripe embeddable pricing table feature In it, First, we finish designing the Frontend Mentor ChallengeHi, does anyone know how I can get those 2 background images on the body like that? This is what I [Solved] CSS Hamburger size ProblemThis is the code pen for reference : https://codepen.io/pen?template=QWxLBQK How can I shrink the Overlap items between different stacking contextsI'm trying to have a button that is within a lower stacking context than an image - to overlap it. I Accessible hidden elementsI was using the fieldset tag and noticed that it needs a legend tag. As I don't want to show the leg Design FeedbackThis is my first weather app project. Is there anything that should be added or is this just fine?