Positioning element outside viewport for css animation without trigering scrollbar

问题

I'm creating simple css animation of text sliding to the page from right. I'm using jQuery to trigger animation by adding a class to element. But the start position must be outside viewport and that triggers bottom scrollbar to appear. How to prevent that?
This is relevant css fragment

h2{
position:absolute;
right:-500px;
top:190px;
font-size:45px;
.transition(3s,  linear);
}
h2.centered{
top:88px;
left:30%;
}

回答1:

Is this what you are looking for? I'm guessing you are triggering the change in class with some form of javascript of jQuery. The trick here is to set:

  overflow-x: hidden;

on the body of your page (although this will remove scrollbars entirely). The better option however would be to apply "overflow-x: hidden" to a container div within your body.

http://jsfiddle.net/Vnvet/2/

来源：https://stackoverflow.com/questions/17426996/positioning-element-outside-viewport-for-css-animation-without-trigering-scrollb