Meinst Du sowas in der Art? Ist aber schon etwas älter, Du solltest es auf Flexbox umstellen. Vielleicht kannst Du etwas davon gebrauchen.
<html>
<head>
<meta charset="UTF-8">
<title>Anker</title>
<!--<link rel="stylesheet" type="text/css" href="anker.css" media="all">-->
<style>
* {
margin:0;
pading:0;
}
html , body {
height:100%;
overflow:hidden;
}
#p1 , #p2 , #p3 , #p1 + a , #p2 + a , #p3 + a {
position:fixed;
}
input {
z-index:1000;
height:39px;
opacity:0;
cursor:pointer;
}
h1 {
background:#d59;
padding:20px;
}
h2 , p {
padding:40px;
}
a {
display:inline-block;
padding:10px 0;
text-align:center;
text-decoration:none;
font-weight:bold;
color:#333;
}
#p1 , #p1 + a{ left:0; width:33.334%; background:#dea; }
#p2 , #p2 + a{ left:33.334%; width:33.334%; background:#ded; }
#p3 , #p3 + a{ left:66.667%; width:33.334%; background:#dda; }
label {
cursor:pointer;
}
label:before , label:after {
content:"<";
position:absolute;
bottom:10px;right:65px;
width:50px;
height:50px;
background:#ddd;
display:block;
line-height:50px;
text-align:center;
border-radius:50%;
z-index:1100;
}
label:after {
content:">";
bottom:10px;right:5px;
}
footer {
height:80px;
width:100%;
background:#444;
position:fixed;
bottom:0;
color:#ddd;
}
main {
position:relative;
top:39px;
width:300%;
height:calc( 100% - 195px );
transition: all 0.6s ease-in-out;
}
#home , #about , #impressum {
width:33.3334%;
height:100%;
float:left;
left:0;
background:#add;
overflow:auto;
}
#home , #impressum {
background:#aa0;
}
#p1:checked ,
#p2:checked ,
#p3:checked {
cursor:default;
}
#p1:checked + a ,
#p2:checked + a ,
#p3:checked + a {
background:#aaa;
}
#p1:checked ~ #l3:after,
#p3:checked ~ #l3:before,
#p2:checked ~ #l2:before,
#p2:checked ~ #l3:before,
#p1:checked ~ #l2:before,
#p1:checked ~ #l3:before
{
display:none;
}
#p1:checked ~ #l1:before,
#p3:checked ~ #l1:after,
#p3:checked ~ #l2:after,
#p3:checked ~ #l3:after
{
background:#aaa;
color:#444;
cursor:default;
}
#p1:checked ~ main {
transform:translateX(0%);
}
#p2:checked ~ main {
transform:translateX(-33.3334%);
}
#p3:checked ~ main {
transform:translateX(-66.6667%);
}</style>
</head>
<body>
<h1>Homepage</h1>
<input type="radio" name="scroll" id="p1" checked="checked"><a href="#home">Home</a>
<input type="radio" name="scroll" id="p2"><a href="#about">About</a>
<input type="radio" name="scroll" id="p3"><a href="#impressum">Impressum</a>
<label id="l1" for="p1"></label>
<label id="l2" for="p2"></label>
<label id="l3" for="p3"></label>
<main>
<div id="home">
<h2>Willkommen</h2>
<p>Eine wunderbare Heiterkeit hat meine ganze Seele eingenommen, gleich den süßen Frühlingsmorgen, die ich mit ganzem Herzen genieße. Ich bin allein und freue mich meines Lebens in dieser Gegend, die für solche Seelen geschaffen ist wie die meine. Ich bin so glücklich, mein Bester, so ganz in dem Gefühle von ruhigem Dasein versunken, daß meine Kunst darunter leidet. Ich könnte jetzt nicht zeichnen, nicht einen Strich, und bin nie ein größerer Maler gewesen als in diesen Augenblicken. Wenn das liebe Tal um mich dampft, und die hohe Sonne an der Oberfläche der undurchdringlichen Finsternis meines Waldes ruht, und nur einzelne Strahlen sich in das innere Heiligtum stehlen, ich dann im hohen Grase am fallenden Bache liege, und näher an der Erde tausend mannigfaltige Gräschen mir merkwürdig werden; wenn ich das Wimmeln der kleinen Welt zwischen Halmen, die unzähligen, unergründlichen Gestalten der Würmchen, der Mückchen näher an meinem Herzen fühle, und fühle die Gegenwart des Allmächtigen, der uns nach seinem Bilde schuf, das Wehen des Alliebenden, der uns in ewiger Wonne schwebend trägt und erhält; mein Freund! Wenn's dann um meine Augen dämmert, und die Welt um mich her und der Himmel ganz in meiner Seele ruhn wie die Gestalt einer</p>
</div>
<div id="about">
<h2>Paule Pulmo</h2>
<p>Eine wunderbare Heiterkeit hat meine ganze Seele eingenommen, gleich den süßen Frühlingsmorgen, die ich mit ganzem Herzen genieße. Ich bin allein und freue mich meines Lebens in dieser Gegend, die für solche Seelen geschaffen ist wie die meine. Ich bin so glücklich, mein Bester, so ganz in dem Gefühle von ruhigem Dasein versunken, daß meine Kunst darunter leidet. Ich könnte jetzt nicht zeichnen, nicht einen Strich, und bin nie ein größerer Maler gewesen als in diesen Augenblicken. Wenn das liebe Tal um mich dampft, und die hohe Sonne an der Oberfläche der undurchdringlichen Finsternis meines Waldes ruht, und nur einzelne Strahlen sich in das innere Heiligtum stehlen, ich dann im hohen Grase am fallenden Bache liege, und näher an der Erde tausend mannigfaltige Gräschen mir merkwürdig werden; wenn ich das Wimmeln der kleinen Welt zwischen Halmen, die unzähligen, unergründlichen Gestalten der Würmchen, der Mückchen näher an meinem Herzen fühle, und fühle die Gegenwart des Allmächtigen, der uns nach seinem Bilde schuf, das Wehen des Alliebenden, der uns in ewiger Wonne schwebend trägt und erhält; mein Freund! Wenn's dann um meine Augen dämmert, und die Welt um mich her und der Himmel ganz in meiner Seele ruhn wie die Gestalt einer</p>
</div>
<div id="impressum">
<h2>Impressum</h2>
<p>Eine wunderbare Heiterkeit hat meine ganze Seele eingenommen, gleich den süßen Frühlingsmorgen, die ich mit ganzem Herzen genieße. Ich bin allein und freue mich meines Lebens in dieser Gegend, die für solche Seelen geschaffen ist wie die meine. Ich bin so glücklich, mein Bester, so ganz in dem Gefühle von ruhigem Dasein versunken, daß meine Kunst darunter leidet. Ich könnte jetzt nicht zeichnen, nicht einen Strich, und bin nie ein größerer Maler gewesen als in diesen Augenblicken. Wenn das liebe Tal um mich dampft, und die hohe Sonne an der Oberfläche der undurchdringlichen Finsternis meines Waldes ruht, und nur einzelne Strahlen sich in das innere Heiligtum stehlen, ich dann im hohen Grase am fallenden Bache liege, und näher an der Erde tausend mannigfaltige Gräschen mir merkwürdig werden; wenn ich das Wimmeln der kleinen Welt zwischen Halmen, die unzähligen, unergründlichen Gestalten der Würmchen, der Mückchen näher an meinem Herzen fühle, und fühle die Gegenwart des Allmächtigen, der uns nach seinem Bilde schuf, das Wehen des Alliebenden, der uns in ewiger Wonne schwebend trägt und erhält; mein Freund! Wenn's dann um meine Augen dämmert, und die Welt um mich her und der Himmel ganz in meiner Seele ruhn wie die Gestalt einer</p>
<p>Eine wunderbare Heiterkeit hat meine ganze Seele eingenommen, gleich den süßen Frühlingsmorgen, die ich mit ganzem Herzen genieße. Ich bin allein und freue mich meines Lebens in dieser Gegend, die für solche Seelen geschaffen ist wie die meine. Ich bin so glücklich, mein Bester, so ganz in dem Gefühle von ruhigem Dasein versunken, daß meine Kunst darunter leidet. Ich könnte jetzt nicht zeichnen, nicht einen Strich, und bin nie ein größerer Maler gewesen als in diesen Augenblicken. Wenn das liebe Tal um mich dampft, und die hohe Sonne an der Oberfläche der undurchdringlichen Finsternis meines Waldes ruht, und nur einzelne Strahlen sich in das innere Heiligtum stehlen, ich dann im hohen Grase am fallenden Bache liege, und näher an der Erde tausend mannigfaltige Gräschen mir merkwürdig werden; wenn ich das Wimmeln der kleinen Welt zwischen Halmen, die unzähligen, unergründlichen Gestalten der Würmchen, der Mückchen näher an meinem Herzen fühle, und fühle die Gegenwart des Allmächtigen, der uns nach seinem Bilde schuf, das Wehen des Alliebenden, der uns in ewiger Wonne schwebend trägt und erhält; mein Freund! Wenn's dann um meine Augen dämmert, und die Welt um mich her und der Himmel ganz in meiner Seele ruhn wie die Gestalt einer</p>
</div>
</main>
<footer>
</footer>
</body>
</html>
Alles anzeigen
