Skip to main content

transitionTimingFunction

The CSS transition-timing-function to be used on the slide items, such as ease, ease-in, east-out, ease-in-out, linear or custom cubic-bezier curve

default​

transitionTimingFunction: 'ease'

Example transitionTimingFunction: "ease" (default)​

new BlazeSlider(el, {
  all: {
    enableAutoplay: true,
    transitionTimingFunction: 'ease', // (default)
    slidesToShow: 3,
  },
})
1
2
3
4
5
6

Example transitionTimingFunction: "linear"​

new BlazeSlider(el, {
  all: {
    enableAutoplay: true,
    transitionTimingFunction: 'linear',
    slidesToShow: 3,
  },
})
1
2
3
4
5
6

Example custom cubic-bezier curve​

new BlazeSlider(el, {
  all: {
    enableAutoplay: true,
    transitionTimingFunction: 'cubic-bezier(.18,.74,.2,1.27)',
    slidesToShow: 3,
  },
})
1
2
3
4
5
6