CSS 背景图片幻灯片

Question

.banner {
    background: url(images/im1.jpg) center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    background-size: cover;
    position: relative;
}
.banner:after {
    content: '';
    position: absolute;
    bottom: 0px;
    left: 1px;
    width: 0;
    height: 0;
    border-bottom: 74px solid #ffffff;
    border-right: 1582px solid transparent;
    border-left: 0px solid transparent;
    transform: rotate(-360deg);
}
.inner-banner {
    background: url(images/im1.jpg);
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    background-size: cover;
    min-height: 350px;
    position: relative;
}

如何自动将im1滑到im6？
我还想在图像底部添加那个小圆形按钮，以便它可以轻松移动。