
<!DOCTYPE html> |
<html lang="en"> |
<head> |
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> |
<title>基于jQuery和CSS3的日历</title> |
<link rel="stylesheet" href="images/calendar.css" media="screen"> |
<style type="text/css"> |
body { background: url(images/bg.png) repeat; width: 960px; margin: 0 auto } |
.footer { margin-top: 100px; text-align: center; color: #666; font: bold 14px Arial } |
.footer a { color: #999; text-decoration: none } |
#wrapper { padding: 50px 0 0 325px; } |
#calendar { margin: 25px auto; width: 370px; } |
</style> |
</head> |
<body> |
<img src="images/title.png" alt=""> |
<div id="calendar"></div> |
<script src="images/jquery.min.js"></script> |
<script src="images/jquery-ui-datepicker.min.js"></script> |
<script> |
$('#calendar').datepicker({ |
inline: true, |
firstDay: 1, |
showOtherMonths: true, |
dayNamesMin: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'] |
}); |
</script> |
</body> |
</html> |



