我想创建一个在网站上来回滚动的动画
HTML“选框”：
<div class="marquee">This is a marquee!</div>
和CSS：
.marquee {
position: absolute;
white-space: nowrap;
-webkit-animation: rightThenLeft 4s linear;
}
@-webkit-keyframes rightThenLeft {
0% {left: 0%;}
50% {left: 100%;}
100% {left: 0%;}
}
问题是,当它到达屏幕的右边缘时,选框不会停止;它一直从屏幕上移开(短暂地出现一个水平滚动条),然后又回来了.
那么,当右边缘到达屏幕的右边缘时,如何使选取框停止？
编辑：奇怪的是,这不起作用：
50% {right: 0%}
解决方法
不知何故,我通过使用margin-right将其设置为工作,并将其设置为从右向左移动.
http://jsfiddle.net/gXdMc/
http://jsfiddle.net/gXdMc/
不知道为什么这种情况下,保证金权利100％不会离开屏幕. ：d
(在镀铬18上测试)
编辑：现在从左到右工作也是http://jsfiddle.net/6LhvL/
