Jump to content
Search Community

Advice on carousel implementation

Antdev test
Moderator Tag

Go to solution Solved by nico fonseca,

Recommended Posts

Hi there

I am creating a carousel where the items move and scale. I have hard coded it using some buttons to illustrate the movement and scaling using buttons to move between elements.

 

I would like to implement "swiping" functionality as this will be used only on a touch screen device.

So I would like it to be a seamless loop too so if the user keeps swiping it loops.

And ideally I would like it so if the user drags the carousel moves with the finger either left or right depending on the finger movement direction.

I am pretty sure Draggable and Scroll Trigger are my friend here but I am not sure how best to hook these into the required animation.

Note I will have different bottles in the finished application.

 

If you can give me any tips on how best to implement this it would be much appreciated. 

 

Here is a codepen I have created.

 

You will need to maximise this to see it properly.

 

Thanks

 

Ant

See the Pen XWVawyK by antdev (@antdev) on CodePen

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...