Browse Button with css style
Hi All,
Here i have create a simple HTML file with the browse button(added some css style).
<html>
<head>
<style>
#filefield {
position:relative;
}
#show_filefield {
position: absolute;
top: 0px;
left: 0px;
z-index: 1;
background:url(images.jpeg) 100% 0px no-repeat;
height:26px;
width:240px;
}
#upload_field {
width:155px;
height:26px;
margin-right:85px;
font-size:16px;
border:solid 1px #000;
}
#hide_filefield {
position:relative;
width:240px;
height:26px;
text-align: right;
-moz-opacity:0 ;
filter:alpha(opacity: 0);
opacity: 0;
z-index: 2;
}
</style>
</head>
<body>
<div id=”filefield”>
<input type=”file” size=”24″ id=”hide_filefield” onchange=”getElementById(‘upload_field’).value = getElementById(‘hide_filefield’).value;” />
<div id=”show_filefield”><input type=”text” id=”upload_field” /></div>
</div>
</body>
</html>
Thanks
leave a comment