Css  代码 IE9里面好像不作用，不知道那位哥 能不能搞个 IE9也支持的
<style type="text/css">
@-moz-keyframes slide {
    from, to { top: 0; }
        10% { top: 0; }
    20% { top: -350px; }
    30% { top: -350px; }
    40% { top: -700px; }
    50% { top: -700px; }
    60% { top: -1050px; }
    70% { top: -1050px; }
    80% { top: -1400px; }
      90% { top: -1400px; }
}
@-webkit-keyframes slide {
      from, to { top: 0; }
      10% { top: 0; }
    20% { top: -350px; }
    30% { top: -350px; }
    40% { top: -700px; }
    50% { top: -700px; }
    60% { top: -1050px; }
    70% { top: -1050px; }
    80% { top: -1400px; }
    90% { top: -1400px; }
}
.list{
    -moz-animation: slide 20s infinite;
}
@-moz-keyframes index_1 {
    from, 20%, to { background-color: rgba(0,0,0,.5); }
    0% { background-color: rgba(255,0,0,.5); }
}
@-moz-keyframes index_2 {
    from, 40%, to { background-color: rgba(0,0,0,.5); }
    20% { background-color: rgba(255,0,0,.5); }
}
@-moz-keyframes index_3 {
    from, 60%, to { background-color: rgba(0,0,0,.5); }
    40% { background-color: rgba(255,0,0,.5); }
}
@-moz-keyframes index_4 {
    from, 80%, to { background-color: rgba(0,0,0,.5); }
    60% { background-color: rgba(255,0,0,.5); }
}
@-moz-keyframes index_5 {
    from, 100%, to { background-color: rgba(0,0,0,.5); }
    80% { background-color: rgba(255,0,0,.5); }
}
@-webkit-keyframes index_1 {
    from, 20%, to { background-color: rgba(0,0,0,.5); }
    0% { background-color: rgba(255,0,0,.5); }
}
@-webkit-keyframes index_2 {
    from, 40%, to { background-color: rgba(0,0,0,.5); }
    20% { background-color: rgba(255,0,0,.5); }
}
@-webkit-keyframes index_3 {
    from, 60%, to { background-color: rgba(0,0,0,.5); }
    40% { background-color: rgba(255,0,0,.5); }
}
@-webkit-keyframes index_4 {怎么把图片做成滚动图片
    from, 80%, to { background-color: rgba(0,0,0,.5); }
    60% { background-color: rgba(255,0,0,.5); }
}
@-webkit-keyframes index_5 {
    from, 100%, to { background-color: rgba(0,0,0,.5); }
    80% { background-color: rgba(255,0,0,.5); }
}
.box{width:500px; height:350px; margin:1em auto; position:relative; overflow:hidden;}
.list{margin:0; padding:0; position:absolute;}
.list{
    -moz-animation: slide 10s infinite;
    -webkit-animation: slide 10s infinite;
}
.slide{vertical-align:bottom;}
.index{position:absolute; right:1em; bottom:1em;}
.index a{display:inline-block; width:20px; height:20px; line-height:20px; margin-left:.5em; border-radius:10px; background-color:rgba(0,0,0,.5);
          text-align:center; text-decoration:none!important; color:#fff;}
.index_1{
    -moz-animation: index_1 20s step-end infinite;
    -webkit-animation: index_1 20s step-end infinite;
}
.index_2{
    -moz-animation: index_2 20s step-end infinite;
    -webkit-animation: index_2 20s step-end infinite;
}
.index_3{
    -moz-animation: index_3 20s step-end infinite;
    -webkit-animation: index_3 20s step-end infinite;
}
.index_4{
    -moz-animation: index_4 20s step-end infinite;
    -webkit-animation: index_4 20s step-end infinite;
}
.index_5{
    -moz-animation: index_5 100s step-end infinite;
    -webkit-animation: index_5 100s step-end infinite;
}
</style>
</head>
Html 代码，滚动5张图片
<div class="box">
    <ul class="list">
        <li><img class="slide" src="asdfadsf.jpg" height="350" /></li>
        <li><img class="slide" src="asgsfdgsd.jpg" height="350" /></li>
        <li><img class="slide" src="adsffddf.jpg" height="350" /></li>
        <li><img class="slide" src="900x600_7SSG2SKJ00AP0001.jpg" height="350" /></li>
        <li><img class="slide" src="jkkkkk.jpg" height="350" /></li>
    </ul>
    <div class="index">
        <a href="javascript:" class="index_1">1</a>
        <a href="javascript:" class="index_2">2</a>
        <a href="javascript:" class="index_3">3</a>
        <a href="javascript:" class="index_4">4</a>
        <a href="javascript:" class="index_5">5</a>
    </div>
</div>
                                                              彭全发
                                                            2012-03-18

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。