Fixierte Fußleiste wie bei Facebook, Netlog und co.
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
austauschen
beginnen
code
container
dank
eigenschaft
fest positionieren
fixieren
haut
http
index
inhalt
kleines beispiel
leiste
machen
position
sauren apfel
unteren rand
url
zeile
-
Hallo,
ich hab ne Frage, die hier glaub ich ganz gut passt. Unzwa will ich ne Leiste auf meiner HP einbauen, die bei scrollbaren contenten auf ihrem Platz bleibt ohne dabei nen iframe oder eine hässliche javascript-animation zu verwenden, die dann bei schnellem scrollen ganz oben "klebt" und runter slidet...
Mehr so was wie in Facebook oder Netlog, oder wie hier auf der linken seite halt eben.
Gibt es da Opensource scripte, oder ist das eh ganz einfach?
Mit z-index:1, bzw z-index:2; funktioniert das nicht bei Firefox! -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
<div style="position:fixed; top:0px; left:0px; width:100%; height:25px">inhalt deiner leiste</div>
achtung: bei dieser variante muss die seite um 25px weiter unten beginnen, da die leiste sonst den inhalt verdeckt.
am besten machst du das mit einem zweiten, absolut positionierten, div-container, der die selbe höhe hat wie die leiste.
mfg -
Irgendwie haut das nicht hin, gibts da nicht ne andere Lösung?
-
ich hab mal eben schnell ein kleines beispiel gebastelt.
http://syberpsace.lima-city.de/test.html
nur mit FireFox getestet, da IE == böse
mfg -
Ich will nicht spammen, aber es geht um eine Fusszeile.
Leider weiß ich da auch nicht so recht, wie man das ohne JS oder Frames lösen soll.
Ansosnten mit CSS halt zwei DIVs, aber da ist dann der Scrollbalken nicht bis ganz unten.
Beitrag zuletzt geändert: 14.2.2010 22:18:47 von reimann -
im grunde macht es keinen unterschied ob die zeile oben oder unten ist
einfach die css-eigenschaft top:0px durch bottom:0px austauschen, und schon hängt die zeile am unteren rand.
mfg -
position: fixed; ist nicht IE 5 und 6 (und weniger) valide. Auf jedenfall würde ich dafür eine Alternative angeben:
<!--[if IE 5]><link href="images/ie5.css" rel="stylesheet" type="text/css" /><![endif]-->
<!--[if IE 6]><link href="images/ie6.css" rel="stylesheet" type="text/css" /><![endif]-->
Heißt also da dann in den sauren Apfel beißen und sie fest positionieren. -
Hey Syberspace!
Genau DAS meine ich! Super gemach (das mit dem Beispiel war klasse :D)t! Danke dir!
Auch den anderen Danke ich
-
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
