Scrollbar appears through CSS animation/transition

You need to set overflow:hidden in the body css. But note that, adding this will hide all overflown contents including the vertical scroll bar and you dont want to do that since the page contents will be hidden if the height is overflown. So if you are using a slide transition (sidewards) and you only want to hide the horizontal scroll bar that appears during transition, then use this instead:

 body {
    overflow-x:hidden;  
}

This way, you are only hiding the horizontal scroll bar and the vertical scroll bar will still work.

Two alternative to solve the flickering problem (movement left/right that happens with scrollbars appearing/disappearing fast)

display scrollbars all the time.

body {
  overflow-y: scroll;
}

This hack (info)

html { 
  margin-left: calc(100vw - 100%); 
}