Oder klebt Die Bank einfach immer am untern Rand des _Viewports_?
So ist es.
Wie soll ich das euch noch erläutern ? Onlinebeispiel gibt es nicht.
Ich versuche es mal mit ne'm Codebeispiel (villeicht hilft das ja...) :
beispiel.html :
<html>....
<body>
[somecontent etc]
<div id=footer">
</div>
...
...</html>
beispiel.css :
html, body {
background-color: #000000;
background-image: url('bild.jpg');
background-repeat: no-repeat;
background-position: top center;
}
[someotherelements etc]
#footer {
position: fixed;
bottom: 0px;
left: 0px;
width: 100%;
height: 200px;
background-image: url('bank.png');
background-position: center bottom;
background-repeat: no-repeat;
z-index: 3;
}
Das Hintergrundbild hat eine größe von sagen wir 1024 x 768 px und ist nicht repetierbar (weil es z.B. ein Foto ist).
Die Bank kommt an's untere Ende des Viewports.
Ist die Auflösung jetzt größer als xxx x _768_ reisst das hintergrundbild ab und der schwarze Hintergrund ist zu sehen.
GENAU DAS IST DAS PROBLEM!
Also wie würde man das am besten lösen ?
Natürlich in dem man die Bank nur so weit runterrutschen lässt bis das Hintergrundbild zu ende ist.
Das Bank-div beinhaltet jetzt aber auch die Erde.
Die ist normalerweise nicht zu sehen.
Wenn jetzt die Bank aber hochgezogen wird (also nicht mehr unten ist) wird die Erde sichtbar und füllt den hässlichen schwarzen Hintergrund.
Werft nochmal einen Blick auf das verlinkte Bild.
Ich wiederhole mich ja die ganze Zeit nur...
ciau - iceteea