positie knop uploaden bestand

De tekst van een button staat onder value en toch altijd in de knop?
Als je deze onder de knop wilt krijgen zal je moeten uitlijnen met labels en/of div/span.
Anders eens code (relevante) tonen.

Hi,
In dit geval is het een 'input veld'.
De tekst 'bestand kiezen' staat dan standaard in de knop en de tekst 'geen bestand gekozen' staat (in eerste instantie) rechts van de knop.
Ik heb code, (maar ben bang dat ik dat hier zo niet mag plaatsen.)
<code><input type="file" name="photoimg" id="photoimg" /></code>
Overigens zijn de standaard teksten per browser verschillend.
Jos

Dat is gewoon een standaard eigenschap van de browser. Dat kun je maar beperkt stylen.

Jep, en daarom brengen sommige mensen een layer aan met z-index'es als ik me niet vergis om hem een eigen styling mee te geven.

Nee jan het gaat om de fileupload knop. Hierbij komt het pad naast de knop te staan van het bestand dat je hebt gekozen.

Het beste dat je kunt doen is de tekst naast de knop helemaal verbergen. zie dit voorbeeld: http://codepen.io/anon/pen/JrjHv

Daarna kun je dit voorbeeld er in verwerken om de tekst weer te geven zoals jij dit wilt: http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_fileupload_files

Hi Frank,
Geweldig bedankt. Dat is precies wat ik zocht.
De multipel input doe ik nog maar even niet. Ik pas namelijk een jquery upload functie, die direct de afbeelding plaatst. En dat vond ik al ingewikkeld genoeg..........
Jos

Hi Frank,
Ik weet niet of je dit nog leest. Inmiddels begrijp ik de opzet. De knoppen staan op -1000. Dus ver 'boven' de pagina. Nu wil het dat als je op de bestand-kiezen knop drukt, het scherm de originele knop zoekt. En dus schuift het scherm omhoog. De knoppen krijg je niet te zien, maar mijn foto schuift onder van het scherm af. Kan ik de knoppen niet ergens ver links van het scherm plaatsen of zo??

Jos

Ja: wellicht met margin-left: 100000000px of margin-top: -1000000000px;

Je moet niet de originele knop zoeken maar de <label> lijkt me. overigens snap ik je vraag niet helemaal..

In mijn voorbeeld klikt de gebruiker op de <label> en niet op de knop. als je daar op klikt dan moet dat label in beeld komen? Maar als een gebruiker daar op klikt dan staat ie toch al in beeld?

Hi Frank, Het gaat erom dat de oorspronkelijke knop naar boven, buiten het beeld is geschoven door in de css op te nemen:

label input[type="file"] {
    position: fixed;
    top: -1000px;
}

Maar als je op de label klikt, om een image te selecteren, zoekt het programma de oorspronkelijk knop op. Dus schuift alles naar boven. Ik heb het als opgelost door aan de css toe te voegen:
[code]

label input[type="file"] {
position: fixed;
top: -1px;
display:none;
]

Nu blijft het scherm gewoon in positie. De knop is echter niet mee te vinden......

ik hoop dat dit een beetje duidelijk is.....
Jos