Upload file html speciale

[email protected]

Nuovo Utente
2 Mar 2013
25
0
0
Ciao a tutti,allora avrei questa piccola necessità di caricare un file con l'HTML.
Questa cosa mi viene perfettamente,solo che volevo aggiungere una piccola modifica ma riscontro dei problemi,nel senso che vorrei che comparisse un immagine sulla quale cliccando mi da la stessa funzionalità di UPLOAD FILE nel senso che mi fa fare quelle ricerca nel pc dei file che voglio caricare,perchè facendo la cosa normalmente mi compare un BUTTON mentre io vorrei che ci fose un immagine.E' possibile oppure no?
Qualcuno mi farebbe vedere come posso fare?Magari con un piccolo esempio?
 

helpdesk

Utente Attivo
30 Set 2009
726
0
0
Pesaro
Ciao, ti basta associare al tasto un'immagine.

esempio:

PHP:
 <input name="Upload" type="image" src= "tua_foto.jpg" alt="upload"width="78" height="38">
 
Ultima modifica:

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
io credo che intendevi un input tipo file
HTML:
 <input name="Upload" type="file"/>
io non sono mari riuscito a modificare il button "sfoglia" o meglio non ci ho mai perso tempo perchè se cerchi nel web ti propongono degli script allucinanti che ti fanno passare la voglia di modificarlo
se c'è una soluzione semplice e a portata sono curioso
 

helpdesk

Utente Attivo
30 Set 2009
726
0
0
Pesaro
Salve ragazzi, non avevo capito.
Se si vuole cambiare il tasto sfoglia di un form upload.
Bisogna utilizzare JS e agire sul DOM.
Inoltre si può poi giocare con il css o agire via JS sul finto Upload Javascript
"Cosa meno complessa"
Un esempio JS: "anche se non è la sezione adatta " :)

PHP:
<script>
 
    var W3CDOM = (document.createElement && document.getElementsByTagName);
    window.onload=initFileUploads;
 function initFileUploads() {
	if (!W3CDOM) return;
	    var fakeFileUpload = document.createElement('div');
	    fakeFileUpload.className = 'fakefile';
	    fakeFileUpload.appendChild(document.createElement('input'));
	    var image = document.createElement('img');
	    image.src='up.png';
	    fakeFileUpload.appendChild(image);
	    var x = document.getElementsByTagName('input');
	for (var i=0;i<x.length;i++) {
		 if (x[i].type != 'file') continue;
		 if (x[i].parentNode.className != 'Tasto_Sfoglia') continue;
		 x[i].className = 'file hidden';
		 var clone = fakeFileUpload.cloneNode(true);
		 x[i].parentNode.appendChild(clone);
		 x[i].relatedElement = clone.getElementsByTagName('input')[0];
		 x[i].onchange = x[i].onmouseout = function () {
		 this.relatedElement.value = this.value;
		}
	}
}


</script>