-
Notifications
You must be signed in to change notification settings - Fork 0
/
example.html
52 lines (45 loc) · 1.46 KB
/
example.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Styled File Input Example</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="imagetoolbar" content="no" />
<link rel="stylesheet" type="text/css" href="css/styledFileInput.css" />
<script type="text/javascript" src="jquery-1.7.2.min.js"></script> <!-- REQUIRED FILE -->
<script type="text/javascript" src="jquery.styledFileInput.src.js"></script> <!-- REQUIRED FILE -->
<style type='text/css'>
select {
width:245px;
}
div.styled_file_input {
border: 1px solid #408ac8;
text-indent: 4px !important;
-moz-border-radius:4px;
-webkit-border-radius:4px;
border-radius:4px;
width:245px;
font-size:14px;
vertical-align:middle;
background-color:#ffffff;
color:#174b63;
}
div.some_random_class {
color:#008800;
}
div.any_extra_classes {
font-family:Arial Narrow;
}
div.that_you_want {
font-style:italic;
}
</style>
</head>
<body>
Basic example of the styledFileInput class. View the source code.<br /><br />
<input type='file' id='test_file_1' />
<script type='text/javascript'>
$('input#test_file_1').styledFileInput({styled_file_id : 'StyledFile1',
classes : ['any_extra_classes', 'that_you_want']});
</script>
</body>
</html>