Preserved Topic: input type="file" (Page 1 of 1) $Pages that link to <a href="https://ozoneasylum.com/backlink?for=18542" title="Pages that link to Preserved Topic: input type=&quot;file&quot; (Page 1 of 1)" rel="nofollow" >Preserved Topic: input type="file" <span class="small">(Page 1 of 1)</span>\$

hecster2k Nervous Wreck (II) Inmate From: sj, ca, usa Insane since: Feb 2002	posted 07-24-2002 18:27 hi all, was wondering if any of you could enlighten me as to adding style to the "browse" button on an input tag? the rest of my page is looking pretty and color coordinated, but it's this browse button that just seems to stick out. and i don't wanna change the layout of my entire page to gray to match the button. help always appreciated. thanks! "there has to be a solution."
kuckus Bipolar (III) Inmate From: Berlin (almost) Insane since: Dec 2001	posted 07-24-2002 18:50 You can do that by simply adding the style sheets you want to the <input> tag: <input type="file" style="border: 1px solid #000000; background: #ffee33; background-image: url("button-bg.gif");"> kuckus (cell #282)
someoneInverse Bipolar (III) Inmate From: Insane since: May 2002	posted 07-24-2002 19:00 something like this should do you code: <html> <head> <script language="JavaScript"> function fBrowseForFile() { var objFileBrowser = document.getElementById("fileBrowser"); objFileBrowser.click(); var strFileName= document.getElementById("strFileName"); strFileName.value = objFileBrowser.value; } </script> </head> <body> <form> <input type="text" name="strFileName"> <img src="images/button.jpg" height="20" width="45" onClick="fBrowseForFile()"> <input type="file" name="fileBrowser" style="display: none"> </form> </body> </html> hth I:. [edit] oops - sorted that minor typo in the code there [/edit] [This message has been edited by someoneInverse (edited 07-24-2002).]
hecster2k Nervous Wreck (II) Inmate From: sj, ca, usa Insane since: Feb 2002	posted 07-24-2002 19:03 cool! thanks! "there has to be a solution."
hecster2k Nervous Wreck (II) Inmate From: sj, ca, usa Insane since: Feb 2002	posted 07-24-2002 19:14 from a CSS viewpoint, can you also set the color of the browse button? "there has to be a solution."
hlaford Bipolar (III) Inmate From: USA! USA! USA! Insane since: Oct 2001	posted 07-24-2002 19:40 i've used the solution provided by someoneInverse with great success. the only time it doesn't work is if the user has javascript disabled. thankfully, we don't have to concern ourselves with that possibility. ahh, the joys of working b2b.
kuckus Bipolar (III) Inmate From: Berlin (almost) Insane since: Dec 2001	posted 07-24-2002 20:08 hecster2k: Yes, you can: <input type="file" style="color: #ffee33;"> kuckus (cell #282)

Preserved Topic: input type="file" (Page 1 of 1) $Pages that link to <a href="https://ozoneasylum.com/backlink?for=18542" title="Pages that link to Preserved Topic: input type=&quot;file&quot; (Page 1 of 1)" rel="nofollow" >Preserved Topic: input type="file" <span class="small">(Page 1 of 1)</span>\$

hecster2k
Nervous Wreck (II) Inmate

From: sj, ca, usa
Insane since: Feb 2002

posted 07-24-2002 18:27

hi all,

was wondering if any of you could enlighten me as to adding style to the "browse" button on an input tag? the rest of my page is looking pretty and color coordinated, but it's this browse button that just seems to stick out. and i don't wanna change the layout of my entire page to gray to match the button. help always appreciated. thanks!

"there has to be a solution."

kuckus
Bipolar (III) Inmate

From: Berlin (almost)
Insane since: Dec 2001

posted 07-24-2002 18:50

You can do that by simply adding the style sheets you want to the <input> tag:

<input type="file" style="border: 1px solid #000000; background: #ffee33; background-image: url("button-bg.gif");">

kuckus (cell #282)

someoneInverse
Bipolar (III) Inmate

From:
Insane since: May 2002

posted 07-24-2002 19:00

something like this should do you

code:

<html>

<head>

<script language="JavaScript">

function fBrowseForFile() {

	var objFileBrowser = document.getElementById("fileBrowser");

	objFileBrowser.click();



	var strFileName= document.getElementById("strFileName");

	strFileName.value = objFileBrowser.value;

}

</script>

</head>

<body>

<form>



<input type="text" name="strFileName">

<img src="images/button.jpg" height="20" width="45" onClick="fBrowseForFile()"> 

<input type="file" name="fileBrowser" style="display: none">



</form>

</body>

</html>

hth
I:.

[edit] oops - sorted that minor typo in the code there [/edit]

[This message has been edited by someoneInverse (edited 07-24-2002).]

hecster2k
Nervous Wreck (II) Inmate

From: sj, ca, usa
Insane since: Feb 2002

posted 07-24-2002 19:03

cool! thanks!

"there has to be a solution."

hecster2k
Nervous Wreck (II) Inmate

From: sj, ca, usa
Insane since: Feb 2002

posted 07-24-2002 19:14

from a CSS viewpoint, can you also set the color of the browse button?

"there has to be a solution."

hlaford
Bipolar (III) Inmate

From: USA! USA! USA!
Insane since: Oct 2001

posted 07-24-2002 19:40

i've used the solution provided by someoneInverse with great success. the only time it doesn't work is if the user has javascript disabled. thankfully, we don't have to concern ourselves with that possibility. ahh, the joys of working b2b.

kuckus
Bipolar (III) Inmate

From: Berlin (almost)
Insane since: Dec 2001

posted 07-24-2002 20:08

hecster2k: Yes, you can:

<input type="file" style="color: #ffee33;">

kuckus (cell #282)