# Does your browser snap too soon?

Testing…

## Demo

Scroll this slider:

1
2
3
4

And see how (or if) this slider slides along with it:

5
6
7
8

In some browsers, setting `scrollLeft` computes the position of the snap destination instead of the value you defined. For example, if each slide is 400px and you set `slider.scrollLeft = 200px` it will scroll to 400px instead of 200px.

### Screencasts

- Chrome
- iOS

## How to Fix

In browsers that snap immediately (e.g., Chrome), you’ll need to disable CSS Scroll Snap on the synced slider: `scroll-snap-type: none;`

9
10
11
12
13
14
15
16
`

    .snaps-immediately .your-class {
    	scroll-snap-type: none;
    }

`

Note : Keep Scroll Snap enabled for the primary slider. Only disable the synced slider, because that’s the one affected by the “snap immediately” bug.

## Browser Support (as of 2019-10-01)

IE
  ❓ Untested
Edge
  ❓ Untested
Firefox
  ⚠️ 68+ Snaps immediately
Chrome
  ⚠️ 69+ Snaps immediately
Safari
  ✅ 11+
Opera
  ⚠️ Snaps immediately
iOS Safari
  ✅ 11+
Android Browser
  ❓ Untested
Chrome for Android
  ⚠️ 76+ Snaps immediately

## References

- Can I use… CSS Scroll snap