• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Websiten Hintergrund pro Klick ändern lassen

Mellipupsi

Mellipupsi

Mitglied
Hallo,

ich hab mal eine Frage. Ist es möglich, denn Websiten Hintergrund per CSS oder einer anderen Methode ändenr zu lassen? Sprich, wenn man wo auf der Seite einen Link anklickt und die Seite lädt sich, dass dann ein anderer Hintergrund erscheint. Im Grunde so wie z.B viva das hat. Hat da jemand eine Idee???

lg Melli
 
Werbung:
Bei Viva sind je Seite andere Hintergrundgrafiken eingebunden.
Das kannst du durch Zuweisung eines ID' oder einer Klasse für den body erreichen.

Beispiel:

Bei Seite 1 ersetzt du <body> mit <body class="seite1">
Bei Seite 2 ersetzt du <body> mit <body class="seite2">
usw.

Per CSS definierst du dann:
Code: 
.seite1 {background-image: url(grafik1.jpg);}
.seite2 {background-image: url(grafik2.jpg);}

usw.
 
Hi prm,

ah okay, das klingt ja schon mal in die richte Richtung. Ist es denn auch möglich, es so zu machen, dasses sich nur auf einer Seite ständig abwechselt. Bei mir sind auch Grafiken. Heißt wenn ich jetzt 5 mal auf die Startseite klicke, dass die sich 5 mal ändert?

lg Melli
 
Werbung:
Möglicherweise lässt sich das mit Javascript machen, womit ich mich nicht auskenne.

Aber:
Warum sollte man fünf mal auf eine Seite klicken?
Normalerweise klickt ein Besucher doch nur Links an, um auf andere Seiten zu kommen.
Ebenso würde die Seite durch solch ein Feature eher zappelig und unruhig und man wird vom eigentlichen Inhalt abgelenkt.

Eine andere Möglichkeit wäre ein Styleswitcher, wo du verschiedene CSS-Dateien hinterlegst und der Besucher auswählen kann, ob er z.B. ein rotes oder gelbes Design möchte.
CSS-Styleswitcher
 
Hmm,

das mit dem klicken war jetzt nur nen Beispiel. Ich meine halt wenn man auf die Seite kommt und dan wo raufklickt und dann wieder zurück auf die Startseite gehen würde, dass halt dann nicht der selbe Hintergrund, sondern ein anderer kommt. Aberich glaub auich davon gehört zu haben das es mit Javajscript ginge...
 
lasst sich doch auch mit PHP und rand() machen.
allerdings muss die hintergrundrafik für den body dann über style-tag oder style-attribut zugewiesen werden statt in der ausgelagerten css.
richtig abwechselnd geht über rand() zwar nicht so ohne weiteres aber zumindest wäre immer ein wechsel da

PHP: 
<?php
$bild = rand(1, 5);
?>
HTML: 
<body style="background-image:url('<?php echo $bild; ?>.jpg';">
 
Zuletzt bearbeitet:
Werbung:
Mit javascript gehts sehr einfach.

Nehmen wir an du rufst deine Seite auf, wechselst die Seite und gehst dann wieder zurück auf die Startseite. Sobal einer auf Startseite klickt rufst du zB mit onClick ne funktion auf:

function hintergrundWechsel() {
document.getElementById("body").style.backgroundIMAGE = "hintergrundNeu.jpg";
}

Dem body halt die id body geben (oder noch einfacher wäre es, einfach getElementByName zu verwenden). Ich weiß dass wenn man die Hintergrundfarbe ändern möchte, der befehl dazu backgroundCOLOR lautet, wie es mit Hintergrundbildern aussieht kann ich jetzt nicht genau sagen. Vielleicht reicht auch nur .style.background - müsstes du mal testen.
 
ist das jetzt ein CSS Befehl? Aber wie mach ich das, damit er die anderen Bilder auch erkennt, weil da ist ja nun nur eines eingetragen?
 
Werbung:
Ich hab nicht wirklich verstanden wie deine Methode funktioniert. Wie ich bereits in mehreren Foren erfahren habe, scheint es wohl verschiedene Varianten zu geben, es zu verwirklichen. Aber verstanden habe ich jetzt noch nicht wirklich eine, vorallem wie ich das einsetze...
 
am sinnvollsten ist folgendes:
Du machst für jedes Bild eine klasse:
.bild1 {
background-image:url(image.jpg);
}
.bild 2 {
background-image:url(image2.jpg);
}
usw usw.

dann lässt du dem element, was den hintergund wechseln soll, per php eine Zufällige class zuweisen:

<div class="bild<?echo rand(1,2) ?>">
wobei die zwei durch die anzahl an classes ersetzt werden muss:
bei drei classes (bild1, bild2, bild3) muss es rand(1,3) sein.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben