abändern des <input type="file">

[Nicki]

Hallo an alle,

besteht die Möglichkeit die Auswahl für ein Upload anders zu realisieren als mit dem <input type="file" name="sample"> ?

Ich würde gerne das Auswahlmenü bei dem man seine Datei zum Upload auswählt über ein Bild, statt über <input type="file" name="bild"> starten.

Wie könnte ich das realisieren - oder = Keine Chance?

Gruß Nicki

[Jeremy]

Hallo!

Ich würde gerne das Auswahlmenü bei dem man seine Datei zum Upload auswählt über ein Bild, statt über <input type="file" name="bild"> starten.

Wenn ich dich richtig verstanden habe, möchtest du beim Klick auf ein Bild den Explorer zur Auswahl einer hochzuladenden Datei öffnen?

[Dieter Raber]

Hallo Nicki,

man kann das mit einem CSS-Trick erreichen und der geht so:

• Du baust das input-Feld in einen <div> ein, gibst diesem per CSS position:relative;z-index:1
• In den <div> vor den <input> kommt dein Bild, dieses positionierst du absolut, z-index:2
• den <input> positionierst du relativ, z-index:3

Wenn alles geklappt hat, siehst du jetzt ein Bild, das von dem <input> teilweise bedeckt wird. Jetzt setzt du den <input> auf opacity: 0, fuer den IE brauchst du den Filter Alpha, das sieht dann etwa so aus:

input {  
  opacity:0;  
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";  
  filter: alpha(opacity=0);					  
}

Wenn man jetzt auf den nicht mehr sichtbaren <input> klickt, oeffnet sich dennoch der Dialog.

Nachteile:

• Das Bild muss eindeutig sein, damit der User auch weiss, dass er darauf klicken soll
• Das Bild sollte vollstaendig vom <input> bedeckt sein, weil es sonst Stellen gibt bei denen beim Klicken nichts passiert
• <input type="file"> sind von Browser zu Browser und OS zu OS sehr verschieden, du musst das gewissenhaft testen.

Gruss

Dieter

[Nicki]

mhhh..

das hört sich ja so an, als könnte das klappen - probiere ich später mal aus.
Muss erst noch mein aktuelles Script fertig machen. Gebe dann später ne Rückmeldung.

Aber vielen Dank schonmal

Gruß

Nicki

[ChrisB]

Hi,

besteht die Möglichkeit die Auswahl für ein Upload anders zu realisieren als mit dem <input type="file" name="sample"> ?

Ich würde gerne das Auswahlmenü bei dem man seine Datei zum Upload auswählt über ein Bild, statt über <input type="file" name="bild"> starten.

http://www.quirksmode.org/dom/inputfile.html

MfG ChrisB