change the css of file_field?
I want to change the css for file_field. Instead of showing origi开发者_运维百科nal browse button. I want to use simple upload button to upload file.
How may i change the css of file_field and set another image on it ? So it will look like a button instead of file upload control.
View
<% form_tag({:controller => "controller_name", :action => "file_upload"}, {:multipart => true}) do%>
<div class="fileinputs">
<input type="file" name="upload" id="upload" class="file" onchange="this.form.submit();" />
<div class="fakefile">
<input class="upload_btn"/>
</div>
</div>
<% end %>
CSS
div.fileinputs {
position: relative;
}
div.fakefile {
position: absolute;
top: 0px;
left: 0px;
z-index: 1;
}
input.file {
position: relative;
text-align: right;
-moz-opacity:0 ;
filter:alpha(opacity: 0);
opacity: 0;
z-index: 2;
}
input.upload_btn {
background:transparent url(/images/upload_btn.gif) no-repeat scroll 0px 0px ;
width:79px;
height:26px;
cursor:pointer;
border:0px;
}
input.upload_btn:hover {
background:transparent url(/images/upload_btn.gif) no-repeat scroll 0px -40px ;
}
精彩评论