Seite 1 von 1

Mouseover -> BG Change

Verfasst: 05.08.2009 18:54
von Sheepfreak
Hey^^
ich bins malwieder >.<

Also,
malwieder ein spezieles Problem.

Folgendes :
Ich würde gerne eine Startseite entwickeln.
Das Design habe ich schon erstellt :

Bild

Wie man sieht soll sie 3 Seiten beinhalten.
Nun habe ich folgendes vor :

Geht man über eines der 3 Logos (Grün,Blau,Orange)
soll sich der Hintergrund ändern.

Einen normalen Mousover kriege ich hin,
nur weiß ich nicht wie ein Mouseover 1. Die Grafik und 2. den Background ändert.^^

Folgendes müsste passieren :

Geht man mit der Maus über ein Logo :

1. Das Logo muss sich ändern
2. Der Background muss sich ändern
3. Bei Mausklick muss man weitergeleitet werden

Ich hoffe jemand kann mir helfen ^^

Mfg.
Andre

Verfasst: 05.08.2009 20:03
von sinsur
Google: "insert Bildbearbeitungsprogramm" tuorial button mouseover effekt o.Ä.

Verfasst: 05.08.2009 20:20
von Sheepfreak
xD
Ich habe das Design doch,
und .pngs habe ich auch,
grafisch also alles kein Ding.

Mouseover kann ich auch,
aber ich brauche einen Script,
der bewirkt das sich der Background ändert.

Verfasst: 05.08.2009 22:31
von Aron_dc
Schau dir mal http://de.selfhtml.org/javascript/sprac ... nmouseover an

Den Button an sich kannst du ja per CSS pseudoklasse :hover verändern, aber den hintergrund bekommst du nur per Javascript geändert.

Verfasst: 05.08.2009 23:16
von Sheepfreak
Danke für den Hinweis,
aber ich kenn mich mit css und mehr nicht sonderlich aus :(

Verfasst: 06.08.2009 01:38
von Aron_dc
Ich weiss nicht wie ich das jetzt verstehen soll. Du hast Ahnung von CSS? Wie willst du dann das Layout umsetzen?

Da musst du dich schon etwas in Eigeninitiative einarbeiten.

Verfasst: 06.08.2009 15:40
von Sheepfreak
Also nochmals gaaaaaaaaaaaaaaaanz langsam :

Ich habe das Design, ich habe die Buttons ich habe einen Mouseoverscript.
ABER der Background soll sich ändern.

Meine Frage lautet : Wie ?!

Ich will nur wissen, ob wer ne Idee für nen Script hat, der den BG beim Mouseover ändert.

Anscheinend geht das nur mit Java,
nur weiß ich da net wie das geht.
Ich bräuchte doch nur einen einzigen Befehl !

Das ist alles.

Verfasst: 06.08.2009 16:02
von Todesritter
Meinst du, wenn man mit der Maus über das jeweilige Pic geht, dass dann sich der Hintergrund in ein Bild verwandelt?

edit: Soll das kleine Bild auch ein Link sein wenn man drauf klickt?

Ich such mal nach einer Lösung, ich meld mich später nochmal.

Verfasst: 06.08.2009 16:20
von Del-User: 1487140
Benutz weniger Copy-Paste Scripte und eigne Dir Kenntnisse in CSS & anderem an.

Verfasst: 06.08.2009 18:20
von Aron_dc
Ich geb dir nochmal einen Link der das ganze schon so ähnlich beschreibt, wie du es brauchst.

http://www.phpbb.de/community/viewtopic.php?f=6&t=30724

Eine fertige Lösung werde ich dir aber nicht präsentieren.
Das ganze habe ich übrigens als 1. Eintrag über eine Googlesuche nach "hintergrundbild per javascript ändern" gefunden, das hätte selbst dir einfallen müssen.

Verfasst: 07.08.2009 01:03
von Zoddy
ganz einfach. musst nur noch die id's anpassen.

Code: Alles auswählen

document.getElementById( "ELEMENTID" ).onmouseover = function () {
   document.body.style.backgroundImage = "url('URL_TO_PIC')";
   document.getElementById( "LOGO_ID" ).style.backgroundImage = "url('URL_TO_PIC')";
};
du müsstest allerdings sicher noch zurück wechseln, wenn die maus nicht mehr auf einem der buttons ist. also beim event "onmouseout" das gleiche nochmal machen, nur eben mit den anderen hintergründen ;).

und das sind aber wirklich sehr einfache und grundlegende sachen, also ein bissel weniger faulheit und mehr eigeninitiative würden dir sicher gut tun ;).

tante edith:
noch einen kleinen flüchtigkeitsfehler behoben, sorry...

Verfasst: 07.08.2009 02:49
von Sheepfreak
Ok, vielen Dank :)

Werde das morgen mal umsetzen.

Mfg.
Andre