图像仅使用CSS从右向左滚动

Question

我有一个包含10张图像的DIV。我想在不使用JavaScript的情况下将此DIV中的图像从右向左滚动。有可能吗？

提前致谢。

Answer 1

简短的回答是：不，你不能使用纯CSS制作动画，至少现在还没有。 CSS动画和变换已经出现，但尚未标准化，也没有足够广泛的支持使它们值得使用。

然而，那说，你应该看看这个：

http://www.romancortes.com/blog/pure-css-coke-can/

巧妙的滚动/滚动效果，只使用标准CSS。没有Javascript，没有CSS动画或变换。非常聪明。它甚至适用于IE8。

当然，它正在使用一些非常偷偷摸摸的CSS技巧来实现这一点，所以它不是一种你将在日常代码中使用的技术。但问题是“它有可能吗？”，而不是“它是否可能没有过于聪明和愚蠢呢？”

Answer 2

没有。因为现在CSS无法处理动画。你需要包含一些javascript来为你处理这个问题。它并不像你想象的那么复杂，因为当前的框架为你做了所有繁重的工作。我个人推荐jQuery http://jquery.com/，但还有其他人。有些人已经解决了您的问题和创建的插件，如果您不确定是否自己创建了{} 3}}

，您应该可以将这些插件放到您的网站上，以便为您提供所需的功能。

修改

我应该补充一点，虽然可以使用某些CSS动画，但某些浏览器不支持它。

Answer 3

http://www.the-art-of-web.com/css/css-animation/

感谢Google搜索：）

就像上面的评论所说，这是CSS3，所以你只能支持浏览器

Answer 4

通过使用CSS3功能的转换是可能的，因此它在IE中不起作用。它确实在ff3.6 +和chrome dunno中有关浏览器的重置，因为我没有时间测试它们。

https://developer.mozilla.org/en/CSS/CSS_transitions

Answer 5

好吧，您只需将包含图片的div设为固定width，然后通过CSS设置whitespace: no-wrap。然后只需将overflow: auto添加到div中，那应该是它。