Autor |
Nachricht |
lubux
Threadersteller
Dabei seit: 24.03.2004
Ort: münster
Alter: 43
Geschlecht:
|
Verfasst Mi 10.08.2005 12:23
Titel [CSS] Frameset mit CSS, Beispiel |
|
|
vor ner weile fand ich hier hilfe, wie man sowas hinbekäme. habs nun mal ein wenig
übersichtlicher (wie ich finde) als in der damals verlinkten beispielsammlung gebastelt.
also wen's interessiert:
http://www.lubux.com/css/css-frames.html
|
|
|
|
|
philstrike
Dabei seit: 08.07.2005
Ort: Bocholt
Alter: 38
Geschlecht:
|
Verfasst Mi 10.08.2005 12:36
Titel
|
|
|
oh das finde ich ja mal klasse. besten dank
gruß
philstrike
|
|
|
|
|
Anzeige
|
|
|
ill-nino
Dabei seit: 17.08.2005
Ort: Oldenburg
Alter: -
Geschlecht: -
|
Verfasst Mi 17.08.2005 22:37
Titel
|
|
|
simpel aber effektiv. css ist einfach nur geil
|
|
|
|
|
meikschmidt
Dabei seit: 29.09.2006
Ort: -
Alter: 46
Geschlecht:
|
Verfasst Mi 01.11.2006 08:55
Titel Frames mit CSS - Ladereihenfolge |
|
|
Grüsst euch ...
Erst einmal besten Dank. ich hatte das zwar auch mal so, aber mit dem ie haute das nicht hin. wusste das mit dem "xml" nicht.
Mein anliegen: es geht um meine Website (in der Signatur anwählbar) und deren unterseiten in den eine "Sidebar" in Form von Anzeigen von Google, Musicload usw. (Dem Thema entsprechend) eingesetzt wurde. wer nun in meinen Quelltext schaut, bemerkt das diese anzeigen mit "JavaScript" eingefügt wurde, und noch vor dem eigentlichen Inhalt geladen wird, was dazu führt das erst die Sidebar ausgeführt wird und dann der Inhalt. Dies möchte ich aber umgekehrt haben. Ich möchte mit dem CSS die Sidebar trotzdem so haben wie jetzt, nur das erst der Inhalt geladen wird und dann die Anzeige. Denn wenn ich den Code kurz vor </bod> einfüge, ist die Sidebar (mit float:right) zwar rechts, aber leider dann ganz unten unterm Inhalt.
Ich hoffe das war jetzt nicht zu komlpiziert
Hier mein CSS Quellcode der eigentlich selbsterklärend sein dürfte:
Code: |
body {background:#E9E8E6; color:#333; font:0.9em/1.7em Arial, Helvetica, sans-serif; padding:0; margin:0;}
a {color:#333; text-decoration:none;}
div#menu {background:#666; margin:0; padding:0;}
ul#menuleiste {margin:0; padding:0;}
ul#menuleiste li {display:inline; list-style:none;}
ul#menuleiste li a {font-size:0.75em; color:#F4F4F4; padding:5px 10px;}
ul#menuleiste li a:hover {background:#F4F4F4; color:#666;}
#logozeile {background:#000 url(../images/meik-schmidt-02.jpg) no-repeat left; height:70px; border-top:1px solid #CC9933; border-bottom:1px solid #555; padding:10px 0 0 150px;}
div#werbung {background:#333 url(../images/schatten-oben.gif) repeat-x bottom; padding:3px 0 9px 10.7em; margin:0;}
div#werbung a {font:0.75em/1.3em Arial, Helvetica, sans-serif; color:#BBB;}
div#werbung a:hover {text-decoration:underline;}
div#navi {float:left; margin:5px 0 0 5px; border-right:1px solid #666; padding:0 1px 0 0;}
div#navi img {border:1px solid #D5D5D5; padding:5px; margin:0 0 5px 5px;}
div#navi img:hover{background:#CCC; border:1px solid #666;}
ul.navigation {margin:0; padding:0;}
ul.navigation li {list-style:none; margin:0; padding:0; }
ul.navigation li a {display:block; margin:0; padding:0 0 0 0.3em; width:10.0em; height:auto;}
ul.navigation li a:hover {background:#666; color:#E9E8E6;}
div#aufenthaltsort {margin:0 1.5em 0 11.5em; padding:0; text-align:left; border-bottom:1px dotted #333;}
div#aufenthaltsort a {text-decoration:none;}
div#aufenthaltsort a:hover {text-decoration:underline;}
div.inhalt {margin:20px 1.5em 20px 11.5em; padding:0;}
div.inhalt a {text-decoration:underline;}
div.inhalt h2 a {text-decoration:none;}
div.inhalt h2 a:hover {text-decoration:underline;}
div.inhalt h3 a {text-decoration:none;}
div.inhalt h3 a:hover {text-decoration:underline;}
div.inhalt img {border:1px solid #D5D5D5; padding:5px; margin:0 5px 5px 0; float:left;}
div.inhalt img.ohne-ausrichtung {float:none;}
div.inhalt a img:hover{background:#CCC; border:1px solid #666;}
h1 {font-size:1.3em; margin:20px 0; padding:o;}
h2 {font-size:1.1em; margin:10px 0 0 0; padding-bottom:0;}
h3 {font-size:1.1em; margin:10px 0 0 0; padding-bottom:0;}
p {text-align:justify; margin:0; padding:0;}
p.geld-verdienen {margin-left:80px;}
p.hinzugefuegt-am {font-size:0.9em; margin-left:80px; color:#003366;}
div#fuss {clear:both;background:#666 url(../images/schatten-unten.gif) repeat-x top; margin:30px 0 0 0; padding:6px 0 0 0; border-bottom:1px solid #555;}
ul#fusszeile {margin:0; padding:0;}
ul#fusszeile li {display:inline; list-style:none;}
ul#fusszeile li a {font-size:0.75em; color:#F4F4F4; padding:5px 10px;}
ul#fusszeile li a:hover {background:#F4F4F4; color:#666;}
#kontaktformular {margin-top:19px; padding:5px;}
input, textarea {background:#F4F4F4; border:1px solid #999; color:#363636;}
.fehler{color:#FF0000;}
.klein {font-size:0.75em;}
#partner-amazon { float:right; border-left:1px dotted #666; border-bottom:1px dotted #666; margin:10px 1.5em 10px 20px; padding:0 0 5px 5px;}
#partner-ebay { float:right; border-left:1px dotted #666; border-bottom:1px dotted #666; margin:10px 1.5em 10px 20px; padding:0 0 5px 5px; line-height:0.9em;}
#partner-google { float:right; border-left:1px dotted #666; border-bottom:1px dotted #666; margin:10px 1.5em 10px 20px; padding:0 0 5px 5px;}
#partner-musicload { float:right; border-left:1px dotted #666; border-bottom:1px dotted #666; margin:10px 1.5em 10px 20px; padding:0 0 5px 5px; line-height:1.2em;}
|
|
|
|
|
|
sahnemuh
Dabei seit: 19.06.2003
Ort: /dev/null
Alter: 42
Geschlecht:
|
Verfasst Mi 01.11.2006 10:09
Titel
|
|
|
versuchs mal mit:
Code: | body.onload = function() {
myLayer = document.getElementById('partner-google');
myScript = document.createElement('script');
myScript.setAttribute('type','text/javascript');
myScript.setAttribute('src','http://pagead2.googlesyndication.com/pagead/show_ads.js');
myLayer.appendChild(myScript);
} |
Zuletzt bearbeitet von sahnemuh am Mi 01.11.2006 10:15, insgesamt 2-mal bearbeitet
|
|
|
|
|
meikschmidt
Dabei seit: 29.09.2006
Ort: -
Alter: 46
Geschlecht:
|
Verfasst Mi 01.11.2006 10:15
Titel
|
|
|
danke sehr, aber ich wollte es vermeiden noch weitere javascript elemente einzu richten. ich meine es müsste mit css-gehen (so aller Frameset mit css, was ich ja jetzt auch schon eigerichtet habe). ich denke das ich da irgendwie etwas eingeben muss, wie "absolute" positionen oder "float" oder so.
In moment ist es so das folgende reihenfolge mit css geladen wird.:
1. Header
2. Navigation
3. Anzeige rechts
4. Inhalt
5. Fusszeile
Und möchte 3.Anzeige rechts nach 4.Inhalt lädt. Irgendeine Angabe ist da im CSS von nöten!?
Vielleicht noch etwas dazu. erreiche ich mit "z-index" im css auch eine ladereihenfolge, oder ist das tatsächlich nur die reine Ebenen-Reihenfolge?
Zuletzt bearbeitet von meikschmidt am Mi 01.11.2006 10:19, insgesamt 1-mal bearbeitet
|
|
|
|
|
sahnemuh
Dabei seit: 19.06.2003
Ort: /dev/null
Alter: 42
Geschlecht:
|
Verfasst Mi 01.11.2006 10:38
Titel
|
|
|
die ladereihenfolge beeinflusst der z-index nicht.
grundsätzlich wird die dokumentenstruktur von der rendering engine zwar zeile für zeile eingelesen, die darstellung und reihenfolge wann welches element geladen wird, lässt sich aber meines wissens nicht ändern. da z.B bilder länger brauchen geladen zu werden, werden zuerst diejenigen elemente angezeigt, die die rendering engine am schnellsten rendern kann um einen möglichst schnellen zugriff auf inhalte und eine gefühl kürzere wartezeit zu erreichen.
|
|
|
|
|
Marx
Dabei seit: 28.10.2006
Ort: Wien
Alter: 52
Geschlecht:
|
Verfasst Mo 06.11.2006 11:59
Titel Quirks-Mode/BackCompat |
|
|
Hallo,
Das Beispiel ist ganz nett aber trotzdem mit Vorsicht zu genießen.
Der Autor schreibt, dass aus "unerfindlichen Gründen" in der ersten Zeile <?xml version="1.0"?> stehen muss.
So unerfindlich ist der Grund jedoch nicht, da er den IE dadurch in den Quirks-Mode zwingt und nur so die gewünschte Darstellung beim IE erfolgt.
LG, Marx
|
|
|
|
|
|
|
|
Ähnliche Themen |
Frameset! nur wie?
Frameset ?
Frameset autoerkennung
Wie ein Frameset mit PHP nachahmen?
Frameset: ab in die Mitte!
Frameset Problem
|
|