unForastero

<Webworking>


endlich anpassbar: der Durchsuchen- Button im Upload Formular

Dienstag, 29 Juni 2010     1 Kommentar  

Fast jedes Uploadfomular, das man erblickt, hat einen "Durchsuchen"-Button. Leider lässt sich dieser Defaulttext nicht so einfach ändern, wie es bei anderen Formularfelder, doch auch geht. "Datei auswählen" vielleicht oder "Festplatte anzeigen". Mit einem kleinen Trick gehts aber schon.

Zuerst packen wir ein DIV um das Feld herum, und verteilen per CSS die Eigenschaft position:relative. Das Inputfeld für den Upload positionieren wir per CSS ebenfalls relative, die Opacity setzen wir auf 0. Leider braucht es dafür 3 Zeilen, weil die Browser hier unterschiedlich ticken. Dann folgt noch ein DIV mit einem leeren Input-Tag, der diesmal absolut positioniert wird.

Der Trick ist, das Uploadfeld steht im Vordergrund (z-index:2) ist aber nicht sichtbar (opacity:0) und ein 2. Input kommt hinzu, in einem Div, der sichtbar ist.



Datei uploaden




Nun, ich habe statt "Durchsuchen" "Datei uploaden" hingeschrieben, man kann aber auch eine Grafik verwenden. Und ja stimmt, der Artikel gehört nicht in die Rubrik PHP, passt hier aber immer noch am Besten. Und eine ganz neue Rubrik wollte ich auch nicht aufmachen. Deshalb sei an dieser Stelle auf das sichere Uploadscript vionlink UploadS und desseb großen Bruder vionlink UploadS XL hingewiesen. In diesen Uploadscripten kann die hier Erlernte Technik direkt in der Praxis getestet werden. In disem Sinne.

Nachtrag: damit die Datei angezeigt wird, muss etwas Javascript her, das findet sich hier



diese Seite teilen:




Kommentare

es gibt insgesamt 1 Kommentar(e)












neu laden








2009 - 2016 Copyright © unforastero.de       rechtliche Hinweise |  Impressum |  Datenschutz