fullcalendar实现一个日历记事备注待办事项效果代码
代码语言:html
所属分类:其他
代码描述:fullcalendar实现一个日历记事备注待办事项效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/bootstrap.3.3.4.css">
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/fullcalendar.min.css">
<style>
* {
padding: 0;
margin: 0;
}
html, body {
position: relative;
/*width: 100%;
height: 100%;*/
}
#calendar {
max-width: 1200px;
margin: 20px auto 0;
}
.green {
color: #FFFFFF;
background-color: #369a5f;
border: 1px solid #257e4a;
}
.yellow {
color: #FFFFFF;
background-color: #f3b20f;
border: 1px solid #af7d00;
}
.red {
color: #FFFFFF;
background-color: #ea5454;
border: 1px solid #b11616;
}
</style>
</head>
<body>
<header class="nav"></header>
<!-- 主体 -->
<div class="main">
<div id="calendar"></div>
</div>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery.2.11.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/bootstrap-3.3.4.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/moment.2.29.1.js"></script>
<!-- 日期处理时间工具 -->
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/fullcalendar.min.js"></script>
<script type="text/javascript">
$(function(){
var get = '2020-05-14';
// $("#calendar").fullCalen.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0