Autor |
Nachricht |
elduderino
Threadersteller
Dabei seit: 09.10.2011
Ort: Augsburg
Alter: 36
Geschlecht:
|
Verfasst Fr 07.09.2012 11:56
Titel div auf 100% der pagegröße |
|
|
Morgen,
baue gerade mein Portfolio neu...
ich kriegs einfach grad nich gebacken, folgendes:
Ich hab im Body ein BG image liegen und will über die ganze Seite ein div aufspannen in dem son raster PNG liegt, dass liegt dann quasi über dem body BG und sieht schick aus.
Das Problem: Ich bekomme das #raster div einfach nicht über die komplette Seitenhöhe, scrollt man nach unten sieht man das dass div genau die Page größe hat...
CSS
Code: |
html{
height: 100%;
min-height: 100%;
}
body{
background-image:url('../BG/broke2.jpg');
background-repeat:no-repeat;
background-position:center top;
background-attachment:fixed;
color: white;
min-height: 100%;
height: 100%;
}
#raster{
width:100%;
background-image:url(../BG/four.png);
background-repeat:repeat;
background-attachment: fixed;
height: 100%;
}
|
HTML
Code: |
<body>
<div id="raster"></div>
</body>
|
Ich hab schon tausend forenbeiträge gewälzt, es macht nie das was es soll.
|
|
|
|
|
xBe
Dabei seit: 04.06.2006
Ort: Mönchengladbach
Alter: 34
Geschlecht:
|
|
|
|
|
Anzeige
|
|
|
elduderino
Threadersteller
Dabei seit: 09.10.2011
Ort: Augsburg
Alter: 36
Geschlecht:
|
Verfasst Fr 07.09.2012 13:44
Titel
|
|
|
Ein 100% background image is kein problem, ich will das sich das div bis an den unteren rand der Seite verlängert, also immer sichtbar ist auch wenn man runterscrollt.
Wenn mich die anderen lösungen hier weitergebracht hätten hätte ich keinen neuen Thread gestartet...
|
|
|
|
|
Karlarsch
Dabei seit: 05.02.2007
Ort: -
Alter: 58
Geschlecht:
|
Verfasst Fr 07.09.2012 13:58
Titel
|
|
|
Im Prinzip muss du nur die Höhe der Seite ermitteln z.B. via jQuery
Code: | $(document).height(); |
Und diese Höhe dann zur rechten Zeit, sprich, wenn alle Inhalte geladen sind, deinem div zuweisen
Code: |
$(window).load(function(){
// do something
});
|
Gruß
Karl
|
|
|
|
|
elduderino
Threadersteller
Dabei seit: 09.10.2011
Ort: Augsburg
Alter: 36
Geschlecht:
|
Verfasst Fr 07.09.2012 14:14
Titel
|
|
|
Danke für den jquery tipp, das war die lösung
Code: |
$(function(){
$('#raster').css({'height':($(document).height())});
$(window).resize(function(){
$('#raster').css({'height':($(document).height())});
});
|
jetzt läufts, schade das man da so nen Umweg gehen muss
|
|
|
|
|
Karlarsch
Dabei seit: 05.02.2007
Ort: -
Alter: 58
Geschlecht:
|
Verfasst Fr 07.09.2012 14:29
Titel
|
|
|
Ich hatte absichtlich auf $(window).load() und nicht auf $(document).ready() hingewiesen.
Wenn du den Unterschied verstehst, weißt du warum.
Gruß
Karl
Zuletzt bearbeitet von Karlarsch am Fr 07.09.2012 14:29, insgesamt 1-mal bearbeitet
|
|
|
|
|
|
|
|