Try to improve the style of the input type=file
This commit is contained in:
parent
aa15a59118
commit
ce82e9b147
3 changed files with 42 additions and 10 deletions
File diff suppressed because one or more lines are too long
|
@ -302,3 +302,33 @@ input[type=button] {
|
|||
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#bbb', endColorstr='#eee')";
|
||||
background: linear-gradient(#000000, #1e1e1e);
|
||||
}
|
||||
|
||||
.fileContainer {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
label.filebutton {
|
||||
width:120px;
|
||||
height:40px;
|
||||
overflow:hidden;
|
||||
position:relative;
|
||||
background:linear-gradient(#000000, #1e1e1e);
|
||||
box-shadow: 0 0 5px #ccc;
|
||||
}
|
||||
|
||||
label span input {
|
||||
z-index: 999;
|
||||
line-height: 0;
|
||||
font-size: 50px;
|
||||
position: absolute;
|
||||
top: -2px;
|
||||
left: -700px;
|
||||
opacity: 0;
|
||||
filter: alpha(opacity = 0);
|
||||
-ms-filter: "alpha(opacity=0)";
|
||||
cursor: pointer;
|
||||
_cursor: hand;
|
||||
margin: 0;
|
||||
padding:0;
|
||||
}
|
||||
|
|
|
@ -2,8 +2,10 @@
|
|||
<div id="upload">
|
||||
<form id="upload_form" enctype="multipart/form-data" method="POST" action="/upload">
|
||||
<div>
|
||||
<div><label for="video_file">Please select video file</label></div>
|
||||
<div><input type="file" name="video_file" id="video_file" accept="video/*" onchange="fileSelected();" /></div>
|
||||
<label class="filebutton">
|
||||
Select a video to upload...
|
||||
<span><input type="file" name="video_file" id="video_file" accept="video/*" onchange="fileSelected();" /></span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
|
|
Loading…
Reference in a new issue