如何为nav＆gt; ul标签制作背景幻灯片？

Question

我想每隔几秒更改图像背景。 banner1 banner2 ...... 我的css代码：

nav>ul{
    width: 529px;
    height: 529px;
    background: url(../images/banner1.png) center no-repeat;
    position: absolute;
    top: 50%;
    margin: -216px -260px;
    left: 50%;
    z-index: 50;
}

html代码：

<nav>
<ul>
anything
</ul>
</nav>

Answer 1

您可以使用此jQuery插件制作背景幻灯片。它将拉伸任何图像以适合容器元素。

您只需要包含该插件并编写与此类似的脚本：

<script>
$(".container-element-class").backstretch([
      "path-to-your/image1.jpg"
    , "path-to-your/image2.jpg"
    , "path-to-your/image3.jpg"
  ], {duration: 3000, fade: 750});
</script>

http://srobbin.com/jquery-plugins/backstretch/