14.06.2006, 18:05
|
|||
|
|||
Ist absoluter container mit Höhe der ganzen Seite möglich?
Hallo,
Nachdem ich nun ein Weilchen daran ohne Ergenis rumbastle und weder bei google noch hier fündig geworden binn, wollte ich fragen ob folgendes überhaupt möglich ist. Gegeben ist eine Seite mit langem Inhalt, so dass also gescrolled werden muss. Nun möchte ich einen DIV-Container absolut über die ganze Seite legen. Mit height: 100%; erreicht man ja zumindest dass die Browserhöhe überlegt wird, sobald man aber weiter nach unten kommt verschwindet es, verständlicher weise. Kann man ein abolutes Element überhaupt über die ganze Seite gehen lassen? 
|
| Sponsored Links |
|
15.06.2006, 10:25
|
|||
|
|||
|
100% bedeutet 100% des dargestellten Viewports (der Bereich des Browserfensters indem die Webeite dargestellt wird).
100% bedeutet nicht, dass damit 100% des auf der Seite geladenen Inhalts dargestellt wird. Siehe dazu auch das Beispiel im Frage-Antworten-Thread.
|
| Sponsored Links |
|
15.06.2006, 11:32
|
|||
|
|||
|
Danke für die Antwort.
Sehe ich es richtig, dass es also nicht möglich ist, die gesammte Seite mit einem absoluten Container zu "übermalen"?
|
|
15.06.2006, 12:08
|
|||
|
|||
|
Zitat:
|
|
15.06.2006, 15:19
|
|||
|
|||
|
Online ist noch nichts, hoffe aber das Untenstehendes mein Vorhaben verdeutlicht.
Beste Grüße. Code:
<html>
<head>
<title>Test</title>
<style type="text/css">
<!--
body{
padding: 0px;
margin: 0px;
}
#absolute{
width:100%;
height: 100%;
position: absolute;
background-color: #C0C0C0;
padding: 0px;
margin: 0px;
}
#content{
text-align: left;
}
-->
</style>
</head>
<body>
<div id="absolute">
Ich bin der Container, der alles verschwinden lässt!
</div>
<div id="content">
mille alius silentio, cursor exemplar tui sesquimellesimus inhumatus tres ait vis pax ubi curiositas vis sum Appello dux. Ne edo Palus profusius dedecus St quibus, se inculta silva sis anima Secundum in Ferito hunc convinco, posco divulgatio Voluntas trilustralis. Diu se Quater rare passim dens, sui hac obscoena cristatus, me Epulor quemadmodum, par affinitas nec ruo Contumax, ne res sed in emereor Lues ita Ita qui Frux, cos Perturpis, dis to immundus, ferveo terribilis luculenta, perago ipse tam hoc succresco Filius excellentia ait to annus offendo Tam, ac Crimen, agna Convenio congressio. Accubo inaestimandus Hic inopia quin lux te lemma Quibus torqueo effero, caveo sufficienter qui Litigo cui Contactus reprobabilis reddo. sustineo munio tenus Versutia Flagitium, spurcus comprovincialis Equinus ile re Placeo ivi Effodio ater ruo Augeo pia Erilis, hae virgo incolo ora Praemoneo deprecativus mel hoc at qua Verbero ara. Recolo iam Decoro vota causa duro edo ut cui praecelsus incunabula. Nec gluto se obex, has ibidem vir intempestivus Cupiditas edo Lambo capto diffidentia ut probus escendo defensabiliter Forca tutis illud homo et aegre. Ver ne. Peruro pars divulgamen Alternis dux os dum. Strues, hac Ingressus iam socius ymo quam finio res secretarius Edoceo. praenuntius picturatus ac ita praecidentius, ora Disicio per integritas insperatus canto, Ico sem mel Leodium rixor agon arx Texo. Esuritio implacabilis his arx Arx tristis hos lex Salus, adduco sto iam Retendo, balanus amo talio ita Accredo. Quo munero/munerior Prudentia, pro, forda sidereus, felix fomentum cui Decessio vae dico nam, sis hi ymo si propense per jus Proprie. Sem Infinitas pica St falx Lesciense Multi. Tum sto decipio ne Sus deduco his nam verecundor Subaudio, hi ne. Prae vox et. Reprobo sino vituperium Parentela humus de expello exinde. Per cur Iam in supparum Eia ago sis misericordaliter Occatio ter aut Aliusmodi vel Fugo redigo, iam ops tam Plaga consulo sui ymo Zephyr humilitas. Ivi praebalteata Occumbo congruens seco, lea qui se surculus sed abhinc praejudico in forix curo. Sui aut hoc refectorium celo hos iam Upilio Ars retineo etsi lac damnatio imcomposite for oneratus sacrificum ora navigatio. St incultus Vox inennarabilis ludo per dis misericordaliter Summitto cos Infectum per velut scaccarium abico, inconsolabilis Occasus. Ipse Succumbo, Accumulo cui supellectilis Cogitatio contumelia fama quadruplator. Per sol insequor prex his arx necessarius Primordia De cum casa fiducialiter laboriosus Secundus, lex asper ros hio cur interrogatio saltem vir Adversa, Gregatim mei Eo metuo sum maro iam proclivia amicabiliter occulto cruor fleo peto delitesco Comperte lacerta his tot Os ut Fruor res Gaza provisio conscientia dux effrenus Promus sui secundus rutila. Celo nam balnearius Opprimo Pennatus, no decentia sui, dicto esse se pulchritudo, pupa Sive res indifferenter. Captivo pala pro de tandem Singulus labor, determino cui Ingurgito quo Ico pax ethologus praetorgredior internuntius. Ops foveo Huius dux respublica his animadverto dolus imperterritus. Pax necne per, ymo invetero voluptas, qui dux somniculosus lascivio vel res compendiose Oriens propitius, alo ita pax galactinus emo. Lacer hos Immanitas intervigilium, abeo sub edo beo for lea per discidium Infulatus adapto peritus recolitus esca cos misericordaliter Morbus, his Senium ars Humilitas edo, cui. Sis sacrilegus Fatigo almus vae excedo, aut vegetabiliter Erogo villa periclitatus, for in per no sors capulus se Quies, mox qui Sentus dum confirmo do iam. Iunceus postulator incola, en per Nitesco, arx Persisto, incontinencia vis coloratus cogo in attonbitus quam repo immarcescibilis inceptum. Ego Vena series sudo ac Nitidus. Speculum, his opus in undo de editio Resideo impetus memor, inflo decertatio. His Manus dilabor do, eia lumen, sed Desisto qua evello sono hinc, ars his misericorditer Casia, hac luo Aliusmodi dux quotienscumque Letalis pie celo traduco, imcomposite seco mos Surculus, Epulae pie Anx.
mille alius silentio, cursor exemplar tui sesquimellesimus inhumatus tres ait vis pax ubi curiositas vis sum Appello dux. Ne edo Palus profusius dedecus St quibus, se inculta silva sis anima Secundum in Ferito hunc convinco, posco divulgatio Voluntas trilustralis. Diu se Quater rare passim dens, sui hac obscoena cristatus, me Epulor quemadmodum, par affinitas nec ruo Contumax, ne res sed in emereor Lues ita Ita qui Frux, cos Perturpis, dis to immundus, ferveo terribilis luculenta, perago ipse tam hoc succresco Filius excellentia ait to annus offendo Tam, ac Crimen, agna Convenio congressio. Accubo inaestimandus Hic inopia quin lux te lemma Quibus torqueo effero, caveo sufficienter qui Litigo cui Contactus reprobabilis reddo. sustineo munio tenus Versutia Flagitium, spurcus comprovincialis Equinus ile re Placeo ivi Effodio ater ruo Augeo pia Erilis, hae virgo incolo ora Praemoneo deprecativus mel hoc at qua Verbero ara. Recolo iam Decoro vota causa duro edo ut cui praecelsus incunabula. Nec gluto se obex, has ibidem vir intempestivus Cupiditas edo Lambo capto diffidentia ut probus escendo defensabiliter Forca tutis illud homo et aegre. Ver ne. Peruro pars divulgamen Alternis dux os dum. Strues, hac Ingressus iam socius ymo quam finio res secretarius Edoceo. praenuntius picturatus ac ita praecidentius, ora Disicio per integritas insperatus canto, Ico sem mel Leodium rixor agon arx Texo. Esuritio implacabilis his arx Arx tristis hos lex Salus, adduco sto iam Retendo, balanus amo talio ita Accredo. Quo munero/munerior Prudentia, pro, forda sidereus, felix fomentum cui Decessio vae dico nam, sis hi ymo si propense per jus Proprie. Sem Infinitas pica St falx Lesciense Multi. Tum sto decipio ne Sus deduco his nam verecundor Subaudio, hi ne. Prae vox et. Reprobo sino vituperium Parentela humus de expello exinde. Per cur Iam in supparum Eia ago sis misericordaliter Occatio ter aut Aliusmodi vel Fugo redigo, iam ops tam Plaga consulo sui ymo Zephyr humilitas. Ivi praebalteata Occumbo congruens seco, lea qui se surculus sed abhinc praejudico in forix curo. Sui aut hoc refectorium celo hos iam Upilio Ars retineo etsi lac damnatio imcomposite for oneratus sacrificum ora navigatio. St incultus Vox inennarabilis ludo per dis misericordaliter Summitto cos Infectum per velut scaccarium abico, inconsolabilis Occasus. Ipse Succumbo, Accumulo cui supellectilis Cogitatio contumelia fama quadruplator. Per sol insequor prex his arx necessarius Primordia De cum casa fiducialiter laboriosus Secundus, lex asper ros hio cur interrogatio saltem vir Adversa, Gregatim mei Eo metuo sum maro iam proclivia amicabiliter occulto cruor fleo peto delitesco Comperte lacerta his tot Os ut Fruor res Gaza provisio conscientia dux effrenus Promus sui secundus rutila. Celo nam balnearius Opprimo Pennatus, no decentia sui, dicto esse se pulchritudo, pupa Sive res indifferenter. Captivo pala pro de tandem Singulus labor, determino cui Ingurgito quo Ico pax ethologus praetorgredior internuntius. Ops foveo Huius dux respublica his animadverto dolus imperterritus. Pax necne per, ymo invetero voluptas, qui dux somniculosus lascivio vel res compendiose Oriens propitius, alo ita pax galactinus emo. Lacer hos Immanitas intervigilium, abeo sub edo beo for lea per discidium Infulatus adapto peritus recolitus esca cos misericordaliter Morbus, his Senium ars Humilitas edo, cui. Sis sacrilegus Fatigo almus vae excedo, aut vegetabiliter Erogo villa periclitatus, for in per no sors capulus se Quies, mox qui Sentus dum confirmo do iam. Iunceus postulator incola, en per Nitesco, arx Persisto, incontinencia vis coloratus cogo in attonbitus quam repo immarcescibilis inceptum. Ego Vena series sudo ac Nitidus. Speculum, his opus in undo de editio Resideo impetus memor, inflo decertatio. His Manus dilabor do, eia lumen, sed Desisto qua evello sono hinc, ars his misericorditer Casia, hac luo Aliusmodi dux quotienscumque Letalis pie celo traduco, imcomposite seco mos Surculus, Epulae pie Anx.
</div>
</body>
</html>
|
|
15.06.2006, 15:36
|
|||
|
|||
|
wenn Du nicht weisst, wie lang #content ist, könntest Du die height mit einem vielfachen von 100% angeben um immer auf der sicheren Seite zu sein. Aber 100% Höhe sind in Deniem Fall halt immer nur 100% des Viewports, also soviel wie man von der Seite in einem Browserfenster sehen kann.
Alternativ kannst Du die Höhe von #content evtl. mit JavaScript auslesen und dann #absolute zuweisen. Welchen Zweck hat denn so ein "Verstecker-Container" im praktischen Einsatz? Dir ist schon klar, dass man nur CSS deaktivieren muss, um die Container nacheinander anstelle übereinander zu sehen, oder?
|
|
15.06.2006, 16:12
|
|||
|
|||
|
hallo,
auf Javasrcipt wollte ich gerade verzichten. Ich wollte versuchen einen Effekt wie Lightbox ihn mit sich bringt zu erziehlen, eben aber ohne Javascript, da die Leute die mit deaktiviertem Javascript unterwegs sind zahlreicher sind als mit deaktiviertem css. Desweiteren würde die iInformation dann einfach zu oberst ausgegeben und da man dann eh nicht mehr von "Design" reden kann nehme ich das gerne in kauf 
|
|
15.06.2006, 16:36
|
|||
|
|||
|
es geht ja auch ohne JS wenn das darüberligende DIV nicht exakt passgenau sein muss. Gib ihm eine height von z.B. 300% und guck ob es nicht kleiner als der längste content ist.
Alternativ könnte man auch #content mit einer fixen Höhe versehen (und overflow: scroll). Dann kennst Du die Höhe für #absolute. Oder Du legst #absolute z.B. mit display:none an, bzw. mit z-index hinter #content (oder positionierung ausserhalb des Viweports) und wenn es dann vor #content erscheinen soll braucht es einen Klick mit PHP-Paramterübergabe und dann ein reload der Seite mit durch den Parameter entsprechend angepasstem CSS für #absolute. Soviel was mir dazu einfällt. PS: Was ist "lightbox"?
|
|
15.06.2006, 16:57
|
|||
|
|||
|
Danke für die schnelle antwort.
Also das mit 300% finde ich nicht so schön, weil es dann halt immer ein ellenlanges Dokument ist, allerdings mit dem overflow hast du mich auf eine Idee bebracht, welche zwar nicht perfekt ist aber schon mehr in die Richtung geht in der ich die Sache gerne hätte. Da ich sowieso variablen übergeben will, wie du es beschrieben hast, kann ich ja auch gleich ein anderes style für den body mitladen. dort dann ein overflow: hidden; und tata. Mal testen wie das aber ist wenn ich eine Anweisung mitten im Text aufrufe. EDIT: So wie ich es mir gedacht habe, er springt immer an den Seitenanfang wenn ein Element in der Mitte der Seite dargestellt werden soll, und presentiert es dann perfekt. Schade! Lightbox: Version 1 Version 2 Ist ein nettes Webseitentool zum Anzeigen von Bildern, ohne das Layout verändern zu müssen. Vorraussetzung allerdings Javacsript. Für weitere Ideen bin ich gernee offen  .
Geändert von amroth.calaelen (15.06.2006 um 17:13 Uhr)
|
| Sponsored Links |
 |
| Themen-Optionen | |
| Ansicht | |
|
|
Ähnliche Themen
|
||||
| Thema | Autor | Forum | Antworten | Letzter Beitrag |
| div container automatische höhe | Kohler | CSS | 1 | 29.06.2011 23:18 |
| Seite 100% Höhe + Registerkartenmenü | GN | CSS | 3 | 01.02.2011 10:39 |
| Höhe der Seite Festlegen | Luk3 | CSS | 3 | 20.11.2010 20:39 |
| Probleme mit dem Layout: divanordnung | Muckel | CSS | 8 | 29.06.2008 12:28 |
| Grundgerüst Propleme (Höhe über ganze Seite) | boerni | CSS | 3 | 30.04.2008 17:05 |
Linear-Darstellung
