bei Seitenwechsel body-Farbe ändern

von **Danny.67** » 22.12.2009, 10:18

Hallo Leute,

als CSS-Neuling stehe ich vor dem Problem, dass ich beim Wechsel einer Seite gerne die Hintergrundfarbe vom body ändern möchte, aber keinen Plan habe, wie ich das anstellen kann. Aktuell habe ich einen fablich passenden Hintergrund direkt über "body" angesteuert. Das möchte ich jetzt aber ändern und zukünftig beim Aufruf einer jeweiligen Seite z.B. bei Home den Hintergrund (body!) in blau, bei Seite 1 den Hintergrund in gelb etc. haben. Der Body soll jeweils die Farbe des Hover in der Menüführung bekommen. Kann mir da jemand helfen?

Ich sag schonmal dankeschön

Dagmar

Aktuell sieht meine Programmierung so aus.

CSS

body
{
margin:0;
padding:0;
background-color:#292929;
color:#d0d0d0;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
}

div
{
position:absolute;
}

div.container
{
position:relative;
top:10px;
width:900px;
height:700px;

position:relative;
margin-left:auto;
margin-right:auto;
}

div.navver
{
left:0px;
height:700px;
width:150px;
background-color:#181818;
padding:0px;
margin:0px;
}

div.navver ul
{
width:inherit;
height:inherit;
text-align:left;
padding:0px;
margin-top:150px;
margin-left:50px;
}

ul.navver li
{
margin-bottom:20px;
list-style:none;
}

div.navver li
{
display:inline;
font-size:20px;
height:25px;
margin:0px;
padding:0px;
list-style:none;
font-size:13px;
max-height:20px;
}

div.navver a
{
text-decoration:none;
color:#d0d0d0;
display:block
padding-top:10px;
margin:0px;
}

div.content
{
top:0px;
left:150px;
height:700px;
width:750px;
background-color:#292929;
overflow:auto;
}

#menue ul
{
letter-spacing:1px;
padding:0px;
margin:40px;
line-height:15px;
}

#menue ul li a
{
display:block;
width:100%;
line-height:15px;
text-decoration:none;
padding:0px;
margin:0px;
}

#menue ul li a:hover
{
background-color:#292929;
text-decoration:none;
line-height:15px;
}

/*--------- NAVI ------------*/

#home a:hover {
border-left: 7px solid #1e48c8;

}

#seite1 a:hover {
border-left: 7px solid #dcf312;

}

#impressum a:hover {
border-left: 7px solid #ffff99;
}

/*--------- END NAVI --------

Meine Index sieht so aus:

<body>
<div class="container">

<div class="navver">
<p> </p>
<?
include("includes/incNavVer.php");

?>
</div>

<div class="content">
<?

if(!isset($_GET['inc']))
{
include("includes/incIntro.php");
}

if(isset($_GET['inc']))

{

if($_GET['inc']==home)
{
include("includes/incHome.php");
}

if($_GET['inc']==seite1)
{
include("includes/incSeite1.php");
}

if($_GET['inc']==impressum)
{
include("includes/incImpressum.php");
}

}

?>
</div>
</body>

Mein Navi-Menü steuer ich über ein Include wie folgt:

<div id="menue">
<ul>
<li id="home"><a href="index.php?inc=home">Home<a/></li>
<li id="seite1"><a href="index.php?inc=dagmar">Seite1<a/></li>
<li id="impressum"><a href="index.php?inc=impressum">Impressum<a/></li>
</ul>
</div>

von **sejuma** » 22.12.2009, 11:05

Da würde ich je Farbe eine eigene Klasse verwenden.
Z.B.

Code: Alles auswählen: .rot {background: red} .blau {background: blue;}

und den body dann öffnen mit

Code: Alles auswählen: <body class="rot">

usw.

von **Danny.67** » 22.12.2009, 11:23

und WO steuer ich das an, bzw. wie krieg ich den body angesteuert?

ich glaub ich sitz grad völlig auf der Leitung *heul*

das CSS ist mir klar, aber nicht die Klassifizierung für den body!

Kannst mir das bitte evtl. in meiner Programmierung einfügen?
DANKE

von **sejuma** » 22.12.2009, 12:53

PHP ist leider nicht mein Ding. Hab's schon oft versucht, will aber nicht an mich dran.
Aber ich denke, wenn jede Seite ein eindeutiges Merkmal hat, dann sollte sich das in etwa - laienhaft formuliert - so lösen lassen:

Wenn Seite = Home, dann <body class="red">
Wenn Seite = Kontakt, dann <body class="blue">

und das Ganze dann an die Stelle gesetzt, wo der body geöffnet wird.
Leider kann ich dir das code-mäßig nicht umsetzen.
Oder eben bei jeder Seite die Klasse manuell einfügen.

von **Danny.67** » 22.12.2009, 13:48

vielen Dank für die Rückmeldung. Ich arbeite daran! ... schau ma mal, ob ich ne Lösung finde ;o)

Vielleicht kennt ja auch noch jemand ne "fertige" Lösung!

Auf jeden Fall vielen, vielen Dank für Deine Mühe

bei Seitenwechsel body-Farbe ändern

bei Seitenwechsel body-Farbe ändern

Re: bei Seitenwechsel body-Farbe ändern

Re: bei Seitenwechsel body-Farbe ändern

Re: bei Seitenwechsel body-Farbe ändern

Re: bei Seitenwechsel body-Farbe ändern

Ähnliche Beiträge zu "bei Seitenwechsel body-Farbe ändern"

Wer ist online?