Alternative "submit" Buttons

- WebmasterWork »
- Grafik & Programmierung »
- (X)HTML & CSS & DHTML & Javascript »
- Alternative "submit" Buttons »

jessica-alba

Tripel-As

Dabei seit: 19.01.2003

Beiträge: 161

Dienstag, 21. Januar 2003, 15:37

Ich habe endlich herausgefunden, wie man einen normalen submit button a`la <input type="submit"...> mit einem Bild versehen kann. Und zwar mit <input type="image" src="bild.gif"...>.

Jetzt habe ich also den type zu image ändern müssen. Meine frage ist jetzt, wie mache ich das mit einem "reset" button? Der Code wäre ja <input type="reset"...> und den müsste ich zu <input type="image" src="bild.gif"...> machen, dann würde der Button aber nicht mehr als reset button erkannt, sondern als submit button. Was muss ich tun, damit der reset knopf weiterhin geht, aber mit meinem Bild versehen ist?

>> http://www.jessicaalbafans.de <<

Conny

Routinier

Dabei seit: 19.01.2003

Beiträge: 348

Dienstag, 21. Januar 2003, 17:13

RE: Alternative "submit" Buttons

Salü Jessica

Laut Dr. Web funktioniert dies mittels javascript:

<input type="image" name="click and go" src="submit.gif" alt="abschicken" align="bottom" border="0" width="79" height="19">

Bemerkung:
Da diese Methoden aber nicht mit allen Browsern und nicht zuverlässig laufen, empfehlen wir sie hier nicht.

Nachtrag:
Sorry, das ist ja ein Submit - Danke Fireman :rolleyes:
Da bin jetzt ich auf dem Schlauch gestanden
Muss weiter suchen 8)

Gruss - Conny

Signatur? Ja ... bald (c:

Dieser Beitrag wurde bereits 2 mal editiert, zuletzt von »Conny« (21. Januar 2003, 17:30)

112fireman

unregistriert

Dienstag, 21. Januar 2003, 17:22

RE: Alternative "submit" Buttons

Sorry Conny...

aber das ist ebenfalls ein Submit-Button.
jessica-alba will aber einen Reset-Button.

oder bin ich jetzt auf dem Holzweg

mat

Routinier

Dabei seit: 05.12.2002

Beiträge: 383

Dienstag, 21. Januar 2003, 18:03

Ob Submit- oder Resetbutton, alles geht.

Mit:

	Quellcode
1	<button type="reset"><img></button>

und:

	Quellcode
1	<button type="submit"><img></button>

Conny

Routinier

Dabei seit: 19.01.2003

Beiträge: 348

Dienstag, 21. Januar 2003, 18:43

RE: Alternative "submit" Buttons

Hallo

Hab bis jetzt nix gefunden und nun Mat's Beispiel ausprobiert. Mit seinen Beispiel ist ein grauer Button mit dem gewünschten Bild im Vordergrund. Da müsste man den Button inkl. den Rahmen mit der Hintergrundfarbe der Seite einfärben und der gewünschte Effekt ist da.

Beispiel:
<button type="reset" style="color: #FFFFFF; border: 1px solid #FFFFFF; background-color: #FFFFFF"><img src="deinbild.gif></button>

Gruss - Conny

Signatur? Ja ... bald (c:

112fireman

unregistriert

Dienstag, 21. Januar 2003, 18:56

Leider wird diese Sorte Button
<button></button>
nicht von allen Browsern unterstützt

vorallem Netscape 4.x

jessica-alba

Tripel-As

Dabei seit: 19.01.2003

Beiträge: 161

Dienstag, 21. Januar 2003, 19:30

Nein, das mit dem <button> ist auch nicht das, was ich suche. Denn erstens kann ich die Größe des Buttons nicht einstellen und zweitens verschiebt sich das Bild beim Klick um 1px nach rechts unten. Geht das denn nicht irgendwie mit dem <input ...>? Das wäre so gut wenn das gehen würde. Oder kann man nem normalen verlinkten Bild die ResetEigenschaften zuweisen? Es soll wirklich einfach wie ein verlinktes Bild aussehen.

>> http://www.jessicaalbafans.de <<

Stellaluna

Haudegen

Dabei seit: 20.10.2002

Beiträge: 669

Mittwoch, 22. Januar 2003, 03:05

andere frage:

was möchtest du denn mit dem reset button erreichen ?

ein formular löschen nehme ich an ???

dann probier doch mal folgendes . . .

http://selfhtml.teamone.de/javascript/ob…forms.htm#reset

Zitat

<html><head><title>Test</title>
</head><body>
<form name="Testform" action="">
<input type="text" size="40" name="Feld1"><br>
<input type="text" size="40" name="Feld2"><br>
</form>
<a href="javascript:document.Testform.reset()">Formular leeren</a>
</body></html>

eins drunter steht auch, wie man es baugleich mit dem submit button macht. statt dem text im beispiel "formular leeren" setzt du einfach dein image ein . . . ist javascript . . . funktioniert natürlich nur, wenn der user es im browser aktiviert hat . . .

MfG Laura alias Stellaluna .:. Chaosweib in Person
(¯`·.¸¸.-> Es gibt nix Gutes, ausser man tut es !!! <-.¸¸.·´¯)
(¯`·.¸¸.-> Erst lesen, dann denken, dann schreiben !!! <-.¸¸.·´¯)

jessica-alba

Tripel-As

Dabei seit: 19.01.2003

Beiträge: 161

Mittwoch, 22. Januar 2003, 16:15

Ahhhh, dieses Problem bring mich noch um den Verstand!!! Ich habe jetzt mal das mit dem javascript ausprobiert und es geht auch und wenn ich statt einen Text zum resetten mein resetbutton-bild einsetze geht auch noch alles.

Aber sobald ich einen RolloverEffekt einbaue geht das ganze nichtmehr, Das liegt daran, dass ich dem Bild einen Namen geben muss. Wenn ich dem Bild einfach keinen Namen zuweise geht alles, aber mit Name nicht

.

Was soll ich nur tun?

>> http://www.jessicaalbafans.de <<

ballaballa

Haudegen

Dabei seit: 09.10.2002

Beiträge: 713

Mittwoch, 22. Januar 2003, 19:30

<form name=DeinFormName action="wasweisich.html" method=post>
<input type=text name=wurscht>
<input type=image src=submit.gif>
</form>
<form action=# method=get>
<input type=image src="bild.xyz" onClick="document.DeinFormName.reset()">
</form>

So gehts. DeinFormName musst du durch den Namen deiner Form ersetzen

Mit freundlichen Grüßen
ballaballa,14