Make slideshow in charge theme loop smoothly

[Deadly_Dukes]

I am using charge theme. The slideshow I am using moves automatically in a choppy movement. i was hoping for a slow sliding loop.

[TheUntechnickle]

Hey @Deadly_Dukes,

Here's how to fix it for a smooth sliding loop:

1. Edit your theme.liquid file
2. Find the slideshow section code (usually has "slideshow" in the class or ID)
3. Look for the transition/animation settings
4. Change these values:

.slideshow {
  transition: transform 0.8s ease;
  /* or if using animation property */
  animation: slide 12s infinite ease;
}

The key is changing the timing function to "ease" instead of whatever's there now, and maybe increasing the duration number. That should make it flow smoothly instead of jerking between slides.

Cheers!
Shubham | Untechnickle

[Deadly_Dukes]

i could not find a class ID for .slideshow, i did find slider though, is this the same?

[devcoders]

Hello @Deadly_Dukes 

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > base.css and paste this at the bottom of the file:

.slideshow .flickity-slider {
  transition: transform 1s ease-in-out !important;
  will-change: transform;
}

[Deadly_Dukes]

this did not work for me =[