Question

我需要制作几张背景图片来随时间变化。我尝试了很多东西，但没有任何帮助。我还需要左右两个按钮，但我不知道如何将它们连接到幻灯片。请帮忙。

CSS

.slideSh {
height:900px;
background-image: url("images/back.jpg");
background-size: cover;
background-position: center;
}

HTML

<div class="slideSh"> </div>

Answer 1

使用Nivo滑块：

<!-- Usually in the <head> section -->
<link rel="stylesheet" href="nivo-slider.css" type="text/css" media="screen" 
/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">
</script>
<script src="jquery.nivo.slider.pack.js"></script>


<!-- Then somewhere in the <body> section -->
<div id="slider-wrapper">
    <div id="slider">
        <img src="images/slide1.jpg" alt="" />
        <img src="images/slide2.jpg" alt="" />
        <img src="images/slide3.jpg" alt="" />
        <img src="images/slide4.jpg" alt="" />
    </div>
</div>

http://pixelscrapper-misc-files.s3.amazonaws.com/ps_marisa-lerin_13574_paper-037-template-polka-dots_cu.zip

CSS / JS幻灯片背景图片

1 个答案: