Replacing the normal browse button (fileupload asp.net) with an image

[gomzi]

Hi,
I would like to know as to how one could replace the normal browse button (file upload control) with an image.
Thanks,
Gomzi.

[kenobewan]

Have you tried placing the image on the page and giving it an onclick event? Or do you mean something else?

[gomzi]

Have you tried placing the image on the page and giving it an onclick event? Or do you mean something else?

Sorry mate . Didn't get you.
What I wanna achieve is this -> There is an fileupload control in .NET which provides the users to upload files. That control displays a default browse button which I would like to customize. i.e. replace it with an image.

Thanks,
Gomzi.

[Plater]

You could probably control it with CSS.
Set the text(the word "browse") to a blank string " " or something, then change the css background-image properies and such to what you want?

[gomzi]

You could probably control it with CSS.
Set the text(the word "browse") to a blank string " " or something, then change the css background-image properies and such to what you want?

Had a look at the properties. None of them will help me in achieving that.

[Plater]

Don't think you looked to hard.

In CSS for that that object put

background-image: url(mypicture.jpg);
 

[gomzi]

Don't think you looked to hard.

In CSS for that that object put

background-image: url(mypicture.jpg);
 

Hmm........

That doesn't replace the default button with the image. It sets the background of the textbox (where the file to be uploaded will be displayed).

[Plater]

hmmm indeed
perhaps you could make it invisible and then add a custom button and textbox that proxy through it?

Like clicking your custom picturebutton caused javascript to "click" the hidden file upload button ?

[gomzi]

hmmm indeed
perhaps you could make it invisible and then add a custom button and textbox that proxy through it?

Like clicking your custom picturebutton caused javascript to "click" the hidden file upload button ?

This is the only thing present for the fileupload (on view source)
<input type="file" name="FileUpload1" id="FileUpload1" class="upload" />
Nothing specifically for the button.