DEV Community

Discussion on: Making an animated slider - WotW

Collapse
 
nestedsoftware profile image
Nested Software • Edited

This is a really neat demo!

I wonder if there's a different way to move the slider, i.e. this code:

    sliderStyle () {
      return `transform: translate3d(${this.sliderX}px,0,0)`
    },

I've noticed that in Chrome at least, when the browser is not expanded to its maximum size, moving the slider causes a horizontal scrollbar to appear. I'd have to play around with it myself, but I wonder if changing the position in some other way would fix that problem...

Collapse
 
ederchrono profile image
Eder Díaz • Edited

You're right, I hadn't noticed that. It can easily be fixed by adding overflow-x: hidden; to the .main-container CSS rules. I just made those adjustments in the post, thanks!