Button bleibt "clicked"

RaySpoint · 02.08.2010

Einen wunderschönen guten Morgen,

Ich 'hätt da jern ma 'n Probleem;
Ich finde mich in Dreamweaver CS5 nicht mehr so ganz zurecht... war ein zu großer Sprung

Und zwar:
Ich habe einen Rollover Button erstellt, der funktioniert auch wunderbar, nur wenn ich den Button dann geklickt habe, bleibt er auch so.
Kann mir jemand den HTML-Code geben, damit der Button nach dem Klick wieder in die Ausgangsposition zurück kehrt?

Hier mal noch 'ne Zeile Code für einen Button:

<a href="http://bossedesignz.com" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('home','','navi2_02.png',1)"><img src="navi_02.png" alt="home" name="home" width="100" height="30" border="0" id="home" /></a>

Vielen Dank und fröhliches Aufwachen - Ich empfehle Jacobs Krönung Classic, aber das ist ja geschmackssache!

Ray

P.S.: Wusste nicht so ganz wonach ich googlen sollte!?

Jormungand · 02.08.2010

AW: Button bleibt "clicked"

Bin nicht gerade der JS-Fuzzi, aber müsste im Attribut onmouseout="MM_swapImgRestore()" in der Klammer nicht wieder das Ursprungsbild genannt werden?

fexx · 02.08.2010

AW: Button bleibt "clicked"

sehe ich das richtig, dass du mit diesem button eine navigation realisieren willst? dafür würde ich dir eine listen navigation empfehlen ... einfach mal in google suchen ;-)

RaySpoint · 02.08.2010

AW: Button bleibt "clicked"

...das Mouseout ist nicht das Problem - das funktioniert - Wenn ich den Button mit dem Mauszeiger verlasse, kehrt er auch wieder in die Ursprungssituation zurück.
Nur wenn ich ihn geklickt habe und dann zur Ausgangsseite zurückkehre ist er immernoch geklickt, bis ich wieder mit dem Mauszeiger über ihn fahre.

Und gerade hat sich noch ein Problem ergeben;
Trotz

border:"0" im Image und

img {
border:none;
}

im CSS, habe ich diese hässlichen Umrandungen um meine Buttons...

RaySpoint · 02.08.2010

AW: Button bleibt "clicked"

fexx schrieb:
sehe ich das richtig, dass du mit diesem button eine navigation realisieren willst? dafür würde ich dir eine listen navigation empfehlen ... einfach mal in google suchen ;-)

Nein, das ist 'n ganz normaler Button mit Hyperlink.

fexx · 02.08.2010

AW: Button bleibt "clicked"

achso ich dachte wegen dem "navi" ;-) und warum löst du das ganze nicht mit css?

MyBad · 02.08.2010

AW: Button bleibt "clicked"

Jormungand schrieb:
Bin nicht gerade der JS-Fuzzi, aber müsste im Attribut onmouseout="MM_swapImgRestore()" in der Klammer nicht wieder das Ursprungsbild genannt werden?

Kommt darauf an, wie die dazugehörige JS-Funktion aussieht. Aber so ganz blind getippt, gebe ich dir Recht. Um Genaueres sagen zu können wäre es gut wenn man hier den Quelltext vom Javascript posten würde.

RaySpoint schrieb:
...das Mouseout ist nicht das Problem - das funktioniert - Wenn ich den Button mit dem Mauszeiger verlasse, kehrt er auch wieder in die Ursprungssituation zurück.
Nur wenn ich ihn geklickt habe und dann zur Ausgangsseite zurückkehre ist er immernoch geklickt, bis ich wieder mit dem Mauszeiger über ihn fahre.

Und gerade hat sich noch ein Problem ergeben;
Trotz

border:"0" im Image und

img {
border:none;
}

im CSS, habe ich diese hässlichen Umrandungen um meine Buttons...

Im img-Tag muss es:

HTML:

border="0"

lauten.

RaySpoint · 02.08.2010

AW: Button bleibt "clicked"

Das ist ja alles sehr merkwürdig...

Anscheinend habe ich alles richtig gemacht, nur Firefox zeigt es mir falsch an.
Der IE :hmpf: macht diese Zicken nicht, zeigt mir aber dafür ein anderes Element nicht an...
Das ist doch alles quatsch...
Aber die Border um die Buttons sind immer da...
Als würde im Quelltext nichts dazu drinstehen...
:mad:

Aber Danke für eure Mühen!
Ich poste, dann mal, wenn ich 'ne Lösung hab...

MyBad · 02.08.2010

AW: Button bleibt "clicked"

Poste doch mal deine CSS und dein JS-Quelltext. Eventuell noch nen Screenshot vom Border. Ist das eventuell so eine gestichelte Linie?

GoMeZ · 02.08.2010

AW: Button bleibt "clicked"

RaySpoint schrieb:
[...]
Aber die Border um die Buttons sind immer da...
Als würde im Quelltext nichts dazu drinstehen...

[...]

... ich nehme mal an, es handelt sich bei dieser ominösen Border um einen gepunkteten Rand, der stehen bleibt, wenn man den Link geklickt hat?!

Den bekommt man am einfachsten mit

HTML:

<a onfocus='this.blur()' [...]</a>

weg.

Gruß, der GoMeZ

RaySpoint · 02.08.2010

AW: Button bleibt "clicked"

Wunderbar! Vielen, vielen Dank!
Die gestrichelte Linie war's.
Die ist jetzt also schonmal weg. War mir doch fast so, als dass ich die ganze Zeit nach etwas falschem suche.

So, jetzt ist da aber noch Problem #1,
Meine Buttons kehren nach dem 'klick' nicht zum ausgangsbild zurück.
Was fehlt mir da?

Hier mal das und .

MyBad · 02.08.2010

AW: Button bleibt "clicked"

Jormungand schrieb:
Bin nicht gerade der JS-Fuzzi, aber müsste im Attribut onmouseout="MM_swapImgRestore()" in der Klammer nicht wieder das Ursprungsbild genannt werden?

Jormungand hat dir damit schon die Antwort gegeben!

HTML:

onmouseout="MM_swapImgRestore()"

muss mit den passenden Parametern aufgerufen werden, denke ich. Versuch es mal so:

HTML:

onmouseout="MM_swapImgRestore('home','','file:///D|/BosseDesigNz/www/his is it!/navi_02.png',1)"

Aber ohne Garantie. Alternativ würde ich dir eh dazu raten, das ganze per CSS zu lösen. Das geht auch wunderbar und benötigt kein JavaScript.

Noch ein Tipp am Rande. Nutze relative Pfade zu deinen Bildern. Zum Beispiel "images/button.gif".

RaySpoint · 02.08.2010

AW: Button bleibt "clicked"

Hm...
Also wenn ich die Klammer mit Parametern fülle, bringt mir das leider garnix.
Da ich weder von HTML noch CSS besonders viel Ahnung habe - bin aber gerade hart dabei es zu lernen - ist das leichter gesagt als getan.

Würde es gern ins CSS packen, wenn ich genau wüsste wie.
Aber in 12 Stunden und 20 Tutorials auf YouTube später kann ich's vielleicht

Aber im HTML muss es trotzdem gehen, ich möchte ja flexibel bleiben und alles wissen!

Aber schonmal vielen Dank bis hierhin!

sokie · 02.08.2010

AW: Button bleibt "clicked"

GoMeZ schrieb:
... ich nehme mal an, es handelt sich bei dieser ominösen Border um einen gepunkteten Rand, der stehen bleibt, wenn man den Link geklickt hat?!

Den bekommt man am einfachsten mit

HTML:

<a onfocus='this.blur()' [...]</a>

weg.

Gruß, der GoMeZ

Das ist allerdings eine barrierefreiheits-Sünde. (ist auch nicht unbedingt der richtige Weg). wenn die Ourline nicht angezeigt werden soll, wenn das Element den focus hat, ist es mit der CSS regel

Code:

outline:0;

wegzubekommen.

RaySpoint · 02.08.2010

AW: Button bleibt "clicked"

Ähm...

<a onfocus='this.blur()' [...]</a>

...das schränkt das verhalten der Website dahingehend ein, dass ich mit der Tab-Taste nicht mehr navigieren kann, richtig?...

...und...

outline:0;

...kann ich nur verwenden wenn ich die Buttons auch durch mein CSS definiere, oder?

Ich habe gerade festgestellt, dass aufgrund meines Designs und vieler verschiedener Buttons CSS nicht die Vorzugsvariante für die Schaltflächen ist.

Ich möchte die gesamte Website im Code so stark wie möglich vereinfachen, jedoch habe ich ein sehr anspruchsvolles Design, welches oberste Priorität hat, so muss ich also den optimalen Weg zwischen verschiedenen Programmierungen finden...

MyBad · 02.08.2010

AW: Button bleibt "clicked"

Zeig uns doch mal dein Design, wenn es geht. Es gibt eigentlich kein Design, dass sich mit HTML + CSS nicht umsetzen lässt. Es sei denn es geht um komplexe Animationen

RaySpoint · 02.08.2010

AW: Button bleibt "clicked"

...bei den komplexen Animationen bin ich noch nicht angelangt...

Ich denke schon, dass das mit HTML & CSS alles geht,
aber ganz auf Java werde ich am Ende nicht verzichten.
...tut aber auch nichts zur Sache...
Will mir halt nur alle Möglichkeiten offen halten.
Für mich ist die Prioritätenreihenfolge:
1. CSS, 2. HTML, 3. Java, 4. sonstige.

Insofern möcht ich schon versuchen, erstmal alles was geht ins CSS zu packen.

Aber mal schauen, was der Tag noch so bringt.
Ich möchte zum jetzigen Zeitpunkt mein Design noch nicht vorstellen, da da noch viel zu tun ist - bin ein schüchterner Künstler und für Kritik ist's noch nicht das richtige Stadium

.

Wenn wir das Button-Problem erstmal lösen könnten, wäre das 'ne große Hilfe. Ich hab schon öfter mal einfache Websites mit etwaigen Buttons gemacht, aber sowas ist mir noch nicht passiert :'(...

cebito · 02.08.2010

AW: Button bleibt "clicked"

Mit java meinst du sicherlich JavaScript, wie dem auch sei, wie MyBad schon anmerkte wäre es sinnvoll mal dein Design (incl. allem Quelltext) hier zu posten. Ohne tiefer einzudringen, seh ich nämlich schon in deinen kurzen Schnipseln die völlig vermeidbaren Scripte, die du genau so gut mit css umsetzen könntest.
Und - glaubst du wirklich, das du einschätzen kannst ob hier irgendwas was zur Sache tut? Eher nicht, sonst hätte sich dein Thread wohl erübrigt. In dem Sinne - hau raus was du hast.

sokie · 02.08.2010

AW: Button bleibt "clicked"

RaySpoint schrieb:
Ich möchte die gesamte Website im Code so stark wie möglich vereinfachen,

Der ganze Sinn und zweck der Übung HTML+CSS zu verwenden, ist den Code so einfach und übersichtlich wie eben möglich zu halten. Schon deswegen hat Javascript in html Code (body) nichts verloren.

RaySpoint · 03.08.2010

AW: Button bleibt "clicked"

Vielen Dank für eure Einschätzungen!

Ich möchte diesen Thread dennoch nicht auf eine Grundsatzdiskussion ausweiten. Sicher habt ihr viel Know How, dass ihr beitragen könnt,
jedoch soll hier niemand die Programmierung für mich übernehmen. Ich zielte mit dem Thread schon darauf ab, eine Lösung für mein konkretes Problem zu erhalten und freue mich, wenn dies noch gelingt.

Und - glaubst du wirklich, das du einschätzen kannst ob hier irgendwas was zur Sache tut?

Ja, ich denke schon, dass ich mündig genug bin, einzuschätzen, was ich hier preisgeben möchte und was nicht. Über meinen produzierten Code können wir uns unterhalten, wenn das Projekt fertiggestellt ist - vielen Dank!

Sollte also noch jemand etwas zum Problem meiner Buttons beitragen können, freue ich mich sehr darüber - während dessen setze ich mein Selbstudium fort & melde mich zu gegebener Zeit zurück.

Vielen Dank,
mit besten Grüßen,
Ray!