许多100％高度/宽度div-轮播导航？

Question

I have a webpage that uses 100% widths and heights to achieve a fullscreen image style. However, I would like these divs to be side-by-side, and when I click a button it shifts to the next or previous slide. How do you think I could achieve this?

Here's the carousel code:

<div class="page-carousel">

    <div class="page page-01" style="background: url(images/01.jpg);">

        <div class="page-text">

            <h1>Headline</h1>
            <h2>Subheader</h2>

            <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>

        </div>

    </div>

    <div class="page page-02" style="background: url(images/02.jpg);">

        <div class="post-text">

            <h1>Headline</h1>
            <h2>Subheader</h2>

            <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>

        </div>

    </div>

</div>

And the CSS:

.page-carousel{
    height: 100%;
    width: 100%;
}

.page{
    height: 100%;
    width: 100%;
    background: no-repeat bottom center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    position: relative;
    float: left;
    z-index:0;
}

Thanks in advance!

Answer 1

A very quick example to get you on the right track, providing you don't opt for a plugin:

http://jsfiddle.net/22VNQ/1/

Note: Additionally please up-vote and mark answers as correct. It appears you haven't done this for previous answers, hence the lack of response.

Answer 2

You would like to use Slideshow specific javascripts like -

Impress.js : https://github.com/bartaz/impress.js/wiki/Examples-and-demos

Deck.js : http://imakewebthings.com/deck.js/

Reveal.js : https://github.com/hakimel/reveal.js