Hi Forum,
mit folgenden Codes kann man vor- und zurück blättern.
Meine Frage ist nun, wie bekommt man die radio Buttons so positioniert, dass diese unten sind? 
HTML
<div id="wrapper2" align="center">
<input type="radio" id="box1" name="nav" checked="checked" />
<input type="radio" id="box2" name="nav"/>
<input type="radio" id="box3" name="nav"/>
<input type="radio" id="box4" name="nav"/>
<input type="radio" id="box5" name="nav"/>
<div class="holder">
<label for="box1"><div class="switch" id="eins" ></div></label>
<label for="box2"><div class="switch" id="zwei" ></div></label>
<label for="box3"><div class="switch" id="drei" ></div></label>
<label for="box4"><div class="switch" id="vier" ></div></label>
<label for="box5"><div class="switch" id="fünf" ></div></label>
</div>
</div>Code
#wrapper2 {
position: relative;
top: 100px;
left: 200px;
width: 320px;
overflow: hidden;
border: 1px solid #999;
background-color: #0F0;
}
#wrapper2 .switch {
position: relative;
left: 160px;
height: 160px;
width: 160px;
float: left;
}
#wrapper2 .holder {
position: relative;
width: 800px;
border: 1px solid #f00;
background-color: #F00;
}
#wrapper2 #eins {
background: yellow;
height: 75px;
}
#wrapper2 #zwei {
background: orange;
}
#wrapper2 #drei {
background: red;
}
#wrapper2 #vier {
background: blue;
}
#wrapper #fünf {
background: black;
}
#wrapper2 #box1:checked ~ div, #wrapper #box2:checked ~ div,
#wrapper2 #box3:checked ~ div, #wrapper #box4:checked ~ div,
#wrapper2 #box5:checked ~ div{
-webkit-transition: 1s;
-moz-transition: 1s;
-ms-transition: 1s;
-o-transition: 1s;
transition: 1s;
}
#wrapper2 #box1:checked ~ div { margin-left: 0px; }
#wrapper2 #box2:checked ~ div { margin-left: -160px; }
#wrapper2 #box3:checked ~ div { margin-left: -320px; }
#wrapper2 #box4:checked ~ div { margin-left: -480px; }
#wrapper2 #box5:checked ~ div { margin-left: -640px; }