Javascript Problem

[Marcus24]

Hy,
Also ich hab in meinem Script, frames mittels PHP simuliert und Menüs mit Untermenüs erstellt. Soweit ist auch alles klar. Nur steh ich jetzt vor dem Problem, das ich den Bildertausch mit Javascript nicht hinbekomme :/
Ich Poste auch gleich mal den Code, ....

<script language="JavaScript"> 
<!-- 
function doHover(b,i) 
{ 
 f = document[b].src; 
 f = f.substr(0,f.length-5); 
 f+=i+'.png'; 
 document[b].src = f; 
} 
//--> 
</script> 

<?php 

     // Hier steht der ganze PHP Codeteil 

?> 

<a href="index.php" onMouseOver="doHover('home','b')" 
onMouseOut="doHover('home','a')" onMouseDown="doHover
('home','c')"><img src="gif/home_a.png" name="home" alt="Home" 
border="0"></a><br> 

<a href="index.php?section=wir_ueber_uns" onMouseOver="doHover
('wir','b')" onMouseOut="doHover('wir','a')" onMouseDown="doHover
('wir','c')" onmouseup="doHover('wir','a')"><img src="gif/wir_a.png" 
name="wir" alt="Wir &uuml;ber uns" border="0"></a><br> 

<a href="index.php?section=service" onMouseOver="doHover
('service','b')" onMouseOut="doHover('service','a')" 
onMouseDown="doHover('service','c')" onmouseup="doHover
('service','a')"><img src="gif/service_a.png" name="service" alt="Service" 
border="0"></a><br> 

<a href="index.php?section=news" onMouseOver="doHover('news','b')" 
onMouseOut="doHover('news','a')" onMouseDown="doHover('news','c')" 
onmouseup="doHover('news','a')"><img src="gif/news_a.png" 
name="news" alt="News" border="0"></a><br> 

<a href="index.php?section=kontakt" onMouseOver="doHover
('kontakt','b')" onMouseOut="doHover('kontakt','a')" 
onMouseDown="doHover('kontakt','c')" onmouseup="doHover
('kontakt','a')"><img src="gif/kontakt_a.png" name="kontakt" 
alt="Kontakt" border="0"></a><br> 

<a href="index.php?section=sitemap" onMouseOver="doHover
('sitemap','b')" onMouseOut="doHover('sitemap','a')" 
onMouseDown="doHover('sitemap','c')" onmouseup="doHover
('sitemap','a')"><img src="gif/sitemap_a.png" name="sitemap" 
alt="Sitemap" border="0"></a><br> 

<a href="index.php?section=agb" onMouseOver="doHover('agb','b')" 
onMouseOut="doHover('agb','a')" onMouseDown="doHover('agb','c')" 
onmouseup="doHover('agb','a')"><img src="gif/agb_a.png" name="agb" 
alt="AGB" border="0"></a><br>

Nun zum Ablauf: Bei Aufruf der Seite werden alle links mit BildXY_a.png dargestellt. Bewegt ein User den Courser über nen Link, dann wird der link mit BildXY_b.png dargestellt. Und wenn ein User einen Link anklickt, wird der Link mit BildXY_c.png symbolisiert. Das einzige Problem was ich hierbei habe ist, das nach klicken eines linkes zwar das BildXY_c.png aufgerufen wird, aber nach loslassen der Maustaste, zeigt er wieder BildXY_a.png an. Wie oder was muss ich verändern oder hinzufügen, das beim klicken eines linkes das BildXY_c.png bleibt?

[wahsaga]

Re: Javascript Problem

Original geschrieben von Marcus24
Das einzige Problem was ich hierbei habe ist, das nach klicken eines linkes zwar das BildXY_c.png aufgerufen wird, aber nach loslassen der Maustaste, zeigt er wieder BildXY_a.png an.

natürlich, genau das hast du doch auch so programmiert - siehe dein onMouseup-event.

tipp: nächstes mal vielleicht den code analysieren und verstehen was er macht, bevor du per copy&paste "programmierst".

[Marcus24]

Hättest du dir den Code ordentlich unter die Lupe genommen dann hättest du gesehen das sich bei der 1. Verweisung kein onMouseUp - Event befindet. Und auch wenn ich alles onMouseUp - Events rausnehme, was ich mittlerweile schon getan habe, funktioniert es nicht!!!

[wahsaga]

Original geschrieben von Marcus24
Hättest du dir den Code ordentlich unter die Lupe genommen dann hättest du gesehen das sich bei der 1. Verweisung kein onMouseUp - Event befindet.

das habe ich gesehen - aber da du davon nichts erwähnt hast, habe ich das für ein "versehen" gehalten.
zudem hätte ich nicht angenommen, dass jemand dann auch noch den restlichen, irrelevanten code mit dazupostet ...


na gut, werfen wir noch mal einen genaueren blick drauf:
nachdem onMousedown das 'c'-bild aktiviert hat, käme zu zurücktauschen beim loslassen der maustaste nur onMouseup in frage.
vielleicht meinst du aber jetzt gar nicht mehr beim loslassen der maustaste, sondern beim verlassen des links mit dem mauszeiger? da kommt natürlich wieder onMouseout zum zuge ...

[Marcus24]

Sorry, war ein versehen von mir, das ich die OnMouseUp's dazu gepostet hab. Wollt was probieren und hab dann anscheinend den "falschen" Code erwischt. Aber bist auf die OnMouseUp's stimmt alles.

So wie der Code derzeit ist, versteh ich ihn auch. Das einzige was ich nicht hinbekomme, ist das nach dem klick eines Verweises das BildXY_c bleibt und erst wieder wechselt, nachdem man einen anderen Link anklickt.

[asp2php]

Original geschrieben von Marcus24

So wie der Code derzeit ist, versteh ich ihn auch.

offensichtlich nicht, denn

Das einzige was ich nicht hinbekomme, ist das nach dem klick eines Verweises das BildXY_c bleibt und erst wieder wechselt, nachdem man einen anderen Link anklickt.

wie wahsaga auch schon sagte:

natürlich wieder onMouseout zum zuge ...

und genau das hast du ja auch drin, z.B.:

...onMouseOut="doHover('wir','a')...

[Marcus24]

Das hatte ich gestern schon versucht. Hatte gestern nur die OnMouseOver - Events und die OnMouseDown - Events drinn und es hat auch nicht geklappt. Hatte den gleichen Effekt wie ich in meinen 1. Post schon geschrieben habe. Und weils es so auch niht funktioniert hat, hab ich sie wieder rein getan.

[asp2php]

poste mal eine einzige Zeile von dem Link, was du aktuell hast. Ist denn möglich die Sache online zu betrachten?

[wahsaga]

Original geschrieben von Marcus24
Das einzige was ich nicht hinbekomme, ist das nach dem klick eines Verweises das BildXY_c bleibt und erst wieder wechselt, nachdem man einen anderen Link anklickt.

dazu musst du dafür sorgen, dass der onMouseout-event "merkt", dass dieser link derzeit einen "geklickt"-status hat, und nicht zurückgetauscht werden soll.

nimm dir eine globale variable, in die du beim ausführen der onMousedown-aktion die referenz auf den aktuellen link speicherst.
beim onMouseout überprüfst du dann erst, ob der dieses onMouseout aufrufende link gleich dem gespeicherten ist - wenn ja, wird nicht zurückgetauscht.

das sollte sich alles unter beibehaltung/erweiterung der vorhandenen funktion machen lassen; lediglich ein zusätzlicher parameter zur unterscheidung, um welche art von event (onMousedown, onMouseout) es sich handelt, wäre m.E. erforderlich.

[Marcus24]

@wahsaga:
So was in der art hab ich mir auch gedacht. Da ich mich mit Javascript weniger auskenne hab ich keinen Plan wie ich das anstellen könnte.
Könntest du mir vielleich ein Beispiel dazu geben bzw einen Link odg?
THX

[Kropff]

also du hast ja nur eine seite (index.php). die inhalte steuerst du über den section-parameter in den links. warum machst du dann nicht einfach folgendes:

du gibst dein menü mit php aus und definierts einfach eine entsprechende bedingung, z.b.

if ($_GET['section'] == 'wir_ueber_uns')
{
  echo "<img src=\"gif/wir_c.png\" name=\"wir\" alt=\"Wir &uuml;ber uns\">";
}
else
{
     echo "<a href=\"index.php?section=wir_ueber_uns\" onMouseOver=\"doHover
     ('wir','b')\" onMouseOut=\"doHover('wir','a')\"><img src=\"gif/wir_a.png\" 
     name=\"wir\" alt=\"Wir &uuml;ber uns\" border=\"0\"></a>";
} 

gruß
peter

[Marcus24]

Da Javascript bei mit aus welchen gründen nicht so macht wie ich will, hab ich mich entschlossen die PHP variante von Kropff zu nehmen.
Da würde aber auch gleich eine Frage auftauche. Vielleicht sogar ne ziemlich dumme, aber egal. Die Frage wäre, wie ich bei dem Code von Kropff, HTML und PHP von einander trenne :/

[Kropff]

Die Frage wäre, wie ich bei dem Code von Kropff, HTML und PHP von einander trenne

wozu? du mußt die bedingung per php definieren, also warum den code trennen?

OffTopic:

---

du darfts auch peter sagen

---

gruß
peter

[Marcus24]

Ja weil ich die ganzen Links sonst umändern muss. Und bei 30 Links ist das ne Menge arbeit. Aber egal. Hauptsache jetzt funktioniert es so wie ichs haben wollte. Hätt ich gleich mit PHP lösen sollen.

Danke Peter

(so besser *fg*)