Suche im Forum:
Suchen


Autor Nachricht
Beitrag09.07.2010 um 15:31 (UTC)    
Titel: Header soll bei einer bestimmten Seite wechseln [erledigt]

Hallo Leute,
ich benötige dringend eure Hilfe.

Undzwar suche ich für eine Bekannte, die auch hier im Baukasten ist, einen Code, bei dem sich der Header wechselt, wenn man diese bestimmte Seite anklickt.

Ich habe bisher im Forum nur einen zufälligen Headerwechsel per CSS gefunden und einen Headerwechsel als Slideshow, aber keinen Wechsel des Headers, wenn man eine bestimmte Seite auf der Homepage anklickt.

Wer kann helfen?

LG
Jens

#content-container {
width: 1004px;
height: 332px;
background: url("http://www.loaditup.de/files/478313.jpg") no-repeat top;
margin: 0 auto;
padding:0px;
}


#header {
width: 1004px;
height: 261px;
position: relative;
}

#header-title {
position: absolute;
text-transform: uppercase;
right: 50px;
top: 60px;
}
#header-title h1 {
color: #ffffff;
font:30px Arial;
font-weight:bold;
margin-bottom: 2px;
}
#header-title h1 a {
color: #111111;
text-decoration: none;
}
.header-subtitle {
color: #111111;
font:bold 12px Arial;
}


Zuletzt bearbeitet von jens-sonntag am 10.07.2010, 12:52, insgesamt 2-mal bearbeitet
Beitrag09.07.2010 um 17:37 (UTC)    
Titel:

Du willst also, dass dein Header sich ändert, wenn sich die Seite ändert.
Das Problem ist, dass sich das Grundgerüst (das Design) der Seite beim Wechseln nicht ändert.
Also kombinieren wir:
Arrow Die Styleanweisungen für den Header müssen in einen Teil der Seite die sich ändert.
Und was ändert sich wenn eine neue Seite aufgerufen wird?
Der Content!
Also schreiben wir die Styleanweisungen für den Header in den Content.

Schneide die Befehle die den Header betreffen aus "Css Codes ohne Styletags" aus:
Code:
#header {
width: 1004px;
height: 261px;
position: relative;
}

#header-title {
position: absolute;
text-transform: uppercase;
right: 50px;
top: 60px;
}
#header-title h1 {
color: #ffffff;
font:30px Arial;
font-weight:bold;
margin-bottom: 2px;
}
#header-title h1 a {
color: #111111;
text-decoration: none;
}
.header-subtitle {
color: #111111;
font:bold 12px Arial;
}


Nun klickst du im Seiteneditor auf jeder Seite einmal auf Quellcode und fügst folgendes (am Besten ganz oben) ein:
Code:
<style type="text/css">
#header {
width: 1004px;
height: 261px;
position: relative;
}

#header-title {
position: absolute;
text-transform: uppercase;
right: 50px;
top: 60px;
}
#header-title h1 {
color: #ffffff;
font:30px Arial;
font-weight:bold;
margin-bottom: 2px;
}
#header-title h1 a {
color: #111111;
text-decoration: none;
}
.header-subtitle {
color: #111111;
font:bold 12px Arial;
}
</style>


Änderst du nun die Befehle auf einer Seite, treten diese Änderungen nur auf eben dieser in Kraft. So kannst du für jede Seite einen anderen Header einstellen. Vergiss allerdings nicht, wenn du neue Seiten erstellst auch einen Code für den Header einzufügen, sonst bricht das Design auseinander.
______________
Rechtschreibfehler sind gewollt und erhöhen die Qualität des Beitrags.
Beitrag09.07.2010 um 17:59 (UTC)    
Titel:

Hey,
wahnsinn, du bist genial. Ist ja ganz einfach.

Diesen Code muss ich allerdings auch im Quelltext einfügen:

#content-container {
width: 1004px;
height: 332px;
background: url("http://www.loaditup.de/files/478313.jpg") no-repeat top;
margin: 0 auto;
padding:0px;
}

für die Header URL.

Klasse vielen Dank!!!

LG
Jens
Beitrag09.07.2010 um 22:06 (UTC)    
Titel:

jens-sonntag hat Folgendes geschrieben:
Hey,
wahnsinn, du bist genial. Ist ja ganz einfach.

Diesen Code muss ich allerdings auch im Quelltext einfügen:

#content-container {
width: 1004px;
height: 332px;
background: url("http://www.loaditup.de/files/478313.jpg") no-repeat top;
margin: 0 auto;
padding:0px;
}

für die Header URL.

Klasse vielen Dank!!!

LG
Jens


Je nach dem wie das Design aufgebaut ist musst du noch andere Anweisungen übernehmen, im Ernstfall einfach rumtüfteln.

Wenn die Sache erledigt ist, kannst du ja ein [erledigt] vor den Threadtitel machen, dann wissen die Mods, dass sie closen können.
______________
Rechtschreibfehler sind gewollt und erhöhen die Qualität des Beitrags.
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de