hallo meine seite hat ein grundgerüst mit 800px breite
header nimmt volle breite ein
content nimmt 550px ein(float: left)
navi nimmt 180px ein (float: right)
footer nimmt 800px ein
nun soll die navigation wenn der user den inhalt der seite betrachtet und runterscollen muss immer an aktueller position sliden; nennt man das silden Scrollt nach unten dann seht ihr was gemeint ist
hat jemand ein code für mich für diese aktion??
Ich finde so eine Animation extrem störend.
Warum machst dus nicht einfach mit der CSS-Angabe position:fixed;?
position:fixed fruchtet nich im ie6... für den muss man dann letztlich doch das script einbinden.
Ich finde so eine Animation extrem störend.
Warum machst dus nicht einfach mit der CSS-Angabe position:fixed;?
Hey cool, danke das wars!! Für IE6 bleibt es ja dann hoffentlich so wie ohne die Positionsangabe
*zu früh gefreut*
bisher hatte ich immer im IE7,8 getestet aber nie im Firefox. Aber in beiden ist es nicht ganz korrekt. sollte da noch was ausgeglichen werden nach dem position: fixed;?
<div id="header"></div>
<div id="content">
<h2 id="willkommen">Willkommen</h2>
<p>Inhalt folgt.......<br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet,Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet</p>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet,Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet</p>
</div>
<ul id="navi">
<h2>Übersicht:</h2>
<li><a href="./index.php?site=startseite">Startseite</a></li>
<li><a href="./index.php?site=text1">text1</a></li>
<li><a href="./index.php?site=text2">text2</a></li>
<h2>Top-Downloads:</h2>
<li><a href="#">Down-1</a></li>
<li><a href="#">Down-2</a></li>
<li><a href="#">Down-3</a></li>
</ul>
<ul id="footer">
<li><a href="./index.php?site=kontakt">Kontakt</a></li>
<li><a href="./index.php?site=impressum">Impressum</a></li>
<li>Erstellt von<a href="#">©Linktext</a></li>
</ul>* {margin: 0; padding: 0;}
img {border: none;}
a {color: #c0c0c0; text-decoration: none;}
a:hover {color: #97c4ff; text-decoration: underline;}
body {
width: 800px;
height: 100%;
margin: 10px auto;
color: #fff;
background: #000;
font-size: 12px;
font-family: Verdana, Arial, cambria, sans-serif;
line-height: 22px;
}
#header {
border: 5px groove #72aeca;
height: 100px;
background: #414141 url(./img/head.jpg);
}
#header h1 {
font-size: 26px;
font-weight: 100;
letter-spacing: -3px;
padding: 12px 0 5px 10px;
}
#header h1 a {
color: #fff;
text-decoration: none;
}
#header h1 a:hover {
color: #aaa;
text-decoration: none;
}
#header h2 {
color: #ccc;
font-size: 15px;
font-weight: 100;
padding: 0 0 0 11px;
letter-spacing: -1px;
}
#content {
width: 550px;
float: left;
margin: 10px 0 0 0;
padding: 10px;
background: #414141;
border: 5px inset #72aeca;
}
h2 {
color: #c0c0c0;
font-size: 20px;
letter-spacing: -2px;
padding : 10px 0 15px 0;
}
ul#navi {
width: 180px;
float: right;
margin: 10px 0 0 20px;
padding: 5px;
border: 5px inset #72aeca;
font-size: 12px;
color: #59799f;
background: #333;
list-style-type: none;
position: fixed;
}
#navi h2 {
font-size: 12px;
color: #666;
border-bottom: 3px outset #c0c0c0;
}
#navi a {text-decoration: none;}
ul#footer {
clear: both;
margin: 10px 0 0 0;
color: #fff;
background: #414141;
font-size: 9px;
border: 5px inset #72aeca;
text-align: center;
}
ul#footer li {
display: inline;
}
ul#footer li a {
padding: 0 7px 5px 7px;
}Wie schaffe ich es das die Navi überall gleich angezeigt wird. Kann mir vielleicht einer helfen. (Ps: Meine Beiträge werden andauernd entfernt, warum auch immer.) ALle anderen Beiträge wurden schneller beantwortet. Aber ihr kennt mich ja, ich werde jetzt selbigen Beitrag in jeden anderen forum das ich kenne posten und ab heute IMMER alles was ich hier poste poste ich dann auch in 18 anderen foren. DANKE FÜR DIE HILFE IHR ******; ich werde mir ein programm entwicklen lassen indem ich eurer forum mit 20000 Nachrichten in der minute vollklatschen lasse. 1 jahr entwickelt mein hacker das schon, bald fertig und ihr nehmt eure seit efreiwillig OFFLINE Ich mach euch MUNDTOT FH.de
ich werde deinen beitrag jetzt nicht löschen, nur etwas entschärfen.
ich finde der is so lustig und absurd, der stellt optimal deine geistige reife dar.
sowas muss der nachwelt erhalten bleiben.