search

naver / egjs-flicking

🎠 ♻️ Everyday 30 million people experience. It's reliable, flexible and extendable carousel.
https://naver.github.io/egjs-flicking/
MIT License
2.74k stars 128 forks source link

Slide without the motion moving to the next slide? #810

Open Soyeon1128 opened 1 year ago

Soyeon1128 commented 1 year ago

Description

Hello! I'm using vue2 and trying to migrate from "vue-slick-carousel" to"@egjs/vue-flicking". The question is, Can I move on to the next slide without a sliding movement? I don't want to see the motion moving to the next slide when I drag it, but want to make it only fade. For Example, fade option in "vue-slick-carousel". https://codepen.io/isaacalves/pen/XBbeXL This example is exactly what i said.

Steps to check or reproduce

Try to use @egjs/ngx-flicking in vue2

malangfox commented 1 year ago

Hello @Soyeon1128.

You can use flicking.prev(0) and flicking.next(0) to move immediately to the next panel. Additionally, you can use the renderOnlyVisible option and css animation to get the fade implementation you want.

I've created a demo that is the same as your example, check it out and feel free to ask any questions you may have!

Soyeon1128 commented 1 year ago

@malangfox Thank you for answer! I have another question, Is it possible to move immediately to the next step without the motion moving even with drag or touch action? (not clicking button)

malangfox commented 1 year ago

@Soyeon1128

We don't support that implementation directly in our component, and the best way to implement this seems to be adding an mouse/touch/pointer event listener to the element connected with the Flicking to call the prev and next methods.

If you need an example of this implementation, we could leave you with a demo, but this will take some time.

dejardine commented 10 months ago

+1 I'd expect fade to not move the carousel items, i.e. just crossfade fade them