有没有跨浏览器的解决方案来产生一个幻灯片转换与CSS只，没有javascript？下面是html内容的示例：
<div>
<img id="slide" src="http://.../img.jpg />
</div>
解决方法
您可以使用CSS3过渡或CSS3动画在元素中滑动。
对于浏览器支持：http://caniuse.com/
我做了两个快速示例，只是为了告诉你我的意思。
CSS转换(悬停时)
相关代码
.wrapper:hover #slide {
transition: 1s;
left: 0;
}
在这种情况下，Im只是从左边的位置转换：-100px;到0;与1s。持续时间。也可以使用transform：translate();
CSS动画
#slide {
position: absolute;
left: -100px;
width: 100px;
height: 100px;
background: blue;
-webkit-animation: slide 0.5s forwards;
-webkit-animation-delay: 2s;
animation: slide 0.5s forwards;
animation-delay: 2s;
}
@-webkit-keyframes slide {
100% { left: 0; }
}
@keyframes slide {
100% { left: 0; }
}
同样的原理(Demo一)，但动画在2s后自动启动，在这种情况下，我设置了动画填充模式向前，这将持久的结束状态，保持div可见，当动画结束。
就像我说的，两个快速示例，告诉你如何做。
编辑：
有关CSS动画和转换的详细信息，请参阅：
动画
https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Using_CSS_animations
过渡
https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Using_CSS_transitions
希望这有帮助。
