-
Notifications
You must be signed in to change notification settings - Fork 64
/
input.html
executable file
·111 lines (94 loc) · 3.03 KB
/
input.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
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="description" content="CSS3 skins for jQuery UI datapicker" />
<meta name="keywords" content="jquery datepicker themes, jquery datepicker skins, jquery ui datepicker themes, jquery ui datepicker skins, CSS3 jquery datepicker, CSS3 datepicker, CSS3 calendar, javascript datepicker, javascript calendar" />
<meta property="twitter:card" content="summary"/>
<meta property="twitter:site" content="@GitHub">
<meta property="twitter:title" content="rtsinani/jquery-datepicker-skins"/>
<title>jquery-datepicker-skins :: CSS3 skins for jQuery UI datepicker</title>
<link href="css/jquery-ui-1.10.1.css" rel="stylesheet">
<link href="css/siena.datepicker.css" rel="stylesheet">
<link href="css/santiago.datepicker.css" rel="stylesheet">
<link href="css/latoja.datepicker.css" rel="stylesheet">
<link href="css/lugo.datepicker.css" rel="stylesheet">
<link href="css/cangas.datepicker.css" rel="stylesheet">
<link href="css/vigo.datepicker.css" rel="stylesheet">
<link href="css/nigran.datepicker.css" rel="stylesheet">
<style>
body {
font: 100% "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, Verdana, sans-serif;
margin: 0;
background:fff;
}
h1 {
width:900px;
margin: .5em auto 0;
padding: 10px 0 0;
background: url('css/images/cal_logo.png') left center no-repeat;
height: 43px;
line-height: 30px;
padding-left: 50px;
color: #ed7474;
font-size: 1.6em;
}
h2 {
width:900px;
margin: .5em auto 0;
}
article {
display: block;
width: 960px;
margin: 5em auto;
}
input {
font-size: 1em;
}
footer {
width: 900px;
display: block;
margin: 30em auto 5em;
padding: 1em 2em;
color: #888;
font-size: .9em;
background: #f0f0f0;
border-radius: 1.5em;
}
footer a {
color: #666;
text-decoration: none;
}
footer a:hover {
color: #000;
}
footer a:first-child {
font-weight: bold;
}
</style>
</head>
<body>
<a href="https://github.com/rtsinani/jquery-datepicker-skins"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_red_aa0000.png" alt="Fork me on GitHub"></a>
<h1>jQuery datepicker skins</h1>
<h2>Input text example</h2>
<article>
<div>
<input type="text" id="date-picker-input-1" />
</div>
</article>
<footer>
<a href="https://github.com/rtsinani">rtsinani</a>. Built with <a href="https://github.com/rtsinani/jquery-datepicker-skins/raw/master/js/jquery-1.9.1.js">jquery-1.9.1</a> and <a href="https://github.com/rtsinani/jquery-datepicker-skins/raw/master/js/jquery-ui-1.10.1.min.js">jquery-ui-1.10.1</a>. Designs by <a href="http://365psd.com/" target="_blank">365psd.com</a>
</footer>
<script src="js/jquery-1.9.1.js"></script>
<script src="js/jquery-ui-1.10.1.min.js"></script>
<script>
$(function() {
$( "#date-picker-input-1" ).datepicker({
inline: true,
showOtherMonths: true
})
.datepicker('widget').wrap('<div class="ll-skin-lugo"/>');
});
</script>
</body>
</html>