Previous Message
Next Message

Changeing the input type="file" button style!!!

Sent by Zero on 16 July 2004 22:10


I found a way.. Its not very neat... NOT very organized and its somewhat of a hassle, but for those
who "NEED" this feature, I have done it...
the code is below :)
Please Excuse The Bad Code ;)
<html>
<!-- THis only works in IE... If you wan't it to work in other browsers, in the JavaScript, change
"document.all.%element%" to "document.getElementById('%element%')"-->
<!-- I know, the round-about way to change the styles for this is long, and not exactly neat, or
perfect...-->                                     <head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title></title><style>
..browsecluster {height:20px;top:0;left:0;position:absolute;}
#topcluser {elevation:above}
#bottomcluster {elevation:below}
..browsefield {width:300px;color:black;border:thin solid #006699;background:white}
..browsebutton {color:white;background: #006699;border:black;}
</style>
</head>
<body>
<span class="browsecluster" >
<input type="text" class="browsefield" style="z-index:99;elevation:above;position:absolute;"
onkeydown="document.getElementsByName('file').value=this.value" name="filevalue" id="topcluster">
<input type="button" id="bottomcluster"
style="Vertical-align:top;elevation:below;position:absolute;left:302" class="browsebutton"
name="bbutton" value="Browse...">
</span>
<form name="the_form">
<input class="browsecluster" name="file"
style="elevation:below;position:absolute;width:382px;height:20px;border:thin solid #006699"
id="bottomcluster" type="file" onkeypress="document.all.topcluster.value=this.value"
onkeyup="document.all.topcluster.value=this.value"
onkeydown="document.all.topcluster.value=this.value"onchange="document.getElementsByName('filevalue').filevalue.value=this.value"
style="filter:alpha(opacity=0);">
</form>
</body>
</html>






---
Outgoing mail is certified Virus Free.
Checked by AVG anti-virus system (http://www.grisoft.com).
Version: 6.0.719 / Virus Database: 475 - Release Date: 7/13/2004
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Previous Message
Next Message