Adjust slide animation time

FabianGabor commented 9 years ago

Would be nice to be able to set the slide transition time. Maybe by just setting the end translate coordinate and animate it with CSS.

dom-turnbull commented 9 years ago

+1 to this, guessing this will probably be a future feature?

desandro commented 9 years ago

Yes, this would be a nice pro-user feature to have. Right now the physics variables are kind of hard-coded in. I'll have to return to formalize the options to do so. It's not quite ready for public use at the moment.

zslabs commented 9 years ago

+1

gorgoserio commented 9 years ago

+1

r-flash commented 9 years ago

+1

2015-03-12 9:26 GMT+01:00 gordonwes notifications@github.com:

+1

— Reply to this email directly or view it on GitHub https://github.com/metafizzy/flickity/issues/46#issuecomment-78440041.

ChristophLabacher commented 9 years ago

+1

ChristophLabacher commented 9 years ago

The intern physics are pretty cool, but for me having basic CSS3 animation would be enough, and I believe that to be true for many cases. Setting your own transition time and maybe easing function would make it easy to customize the animation and still look natural. This is of course only true if draggable is set to false, so it might be bound to that option.

oppenheimer- commented 9 years ago

+1

StefanEndress commented 9 years ago

+1

paul-straetmans commented 9 years ago

+1 would like to use no animations at all on a static click

bealrx commented 9 years ago

+1

impsart commented 9 years ago

+1

eelkeh commented 9 years ago

+1

drastick commented 9 years ago

+1

VincentPeters commented 9 years ago

+1

mtclmn commented 9 years ago

If custom times aren't possible, would be nice to have options like 'normal', 'fast', 'slow', 'none'.

ghost commented 9 years ago

+1

anthony0579 commented 9 years ago

+1

dougalcrowder commented 9 years ago

+1

vajkri commented 9 years ago

+1

desandro commented 9 years ago

The `selectedAttraction` and `friction` options are now documented

selectedAttraction and friction are the two options that control the speed and motion of the slider.

selectedAttraction attracts the position of the slider to the selected cell. Higher attraction makes the slider move faster. Lower makes it move slower. Default selectedAttraction: 0.025.

friction slows the movement of slider. Higher friction makes the slider feel stickier and less bouncy. Lower friction makes the slider feel looser and more wobbly. Default friction: 0.28.

selectedAttraction: 0.2,
friction: 0.8
// higher attraction and higher friction
// faster transitions

selectedAttraction: 0.01,
friction: 0.15
// lower attraction and lower friction
// slower transitions
// easier to flick past cells

`freeScrollFriction` option documented as well

Slows movement of slider when freeScroll: true. Higher friction makes the slider feel stickier. Lower friction makes the slider feel looser. Default freeScrollFriction: 0.075.

Adjusting these options, you should be able to speed up or slow down how the slider moves when transitioning. You still cannot set an arbitrary time, but this should provide enough fine-grain control. Give it a try! :whale:

mtclmn commented 9 years ago

:+1: Thanks, @desandro. Great addition!

StefanEndress commented 9 years ago

Thanks man!

Hlsgs commented 5 years ago

@desandro selectedAttraction and friction options are cool, but there is still a case to be made for having a fixed timing on the transition: for example, say one wants to add a progress bar that does something(empties) while the slide is transitioning. I've done this a couple of times with other sliders, but i really wish to migrate my workflow to Flickity because I'm absolutely done with sliders that use clones :) However, this and #233 are preventing me from doing so.

That being said, if I set friction: 1, is there some math that can be done to infer the transition time from the value of selectedAttraction?

metafizzy / flickity