Recently, in this mobile phone page, pie charts are implemented with CSS3. The date Switch JS code is as follows (self-written, light test without bug):
Post code comes in actually directly can preview;: Below is the effect (can click OH)
JS Daily Calendar (previous day, next day):
日历
< 当前日期 >Code:
<! DOCTYPE html>
<title> Calendar </title>
<style>
Span:first-child,
Span:last-child{display:inline-block;background: #ccc; width:20px;text-align:center;}
</style>
<body>
<div id= "Date" >
<span><</span>
<span> Current Date </span>
<span>></span>
</div>
<script type= "Text/javascript" >
Get page UI
var Date_view = document.getElementById (' Date '),
Btn_prev = Date_view.getelementsbytagname (' span ') [0],
Date_text = Date_view.getelementsbytagname (' span ') [1],
Btn_next = Date_view.getelementsbytagname (' span ') [2];Get time
var d = new Date (),
Year = D.getfullyear (),
month = D.getmonth () + 1,
Date = D.getdate ();date_text.innerhtml = year + ' years ' + month + ' month ' + date + ' Day ';
Btn_prev.onclick = function () {
date--
MONTH_PD ()
date_text.innerhtml = year + ' years ' + month + ' month ' + date + ' Day ';
}
Btn_next.onclick = function () {
date++
MONTH_PD ()
date_text.innerhtml = year + ' years ' + month + ' month ' + date + ' Day ';
}
function month_pd () {
function Set_date (ND) {
if (date>nd) {
Date = 1
month = month+1
if (month>12) {month=1;year =year+1}
}
if (date<1) {
month = Month-1
if (month<1) {month=12;year =year-1}
Date = new Date (year,month-1,0). GetDate ()
}
}
If (year% 400 = = 0 | | (year% 4 = = 0 && Year% 100! = 0)) Isy = true;
Switch (month) {
Case 1:
Case 3:
Case 5:
Case 7:
Case 8:
Case 10:
Case 12:
Set_date (31)
Break
Case 4:
Case 6:
Case 9:
Case 11:
Set_date (30)
Break
Case 2:
if (Isy) {
Set_date (29)
}else{
Set_date (28)
}
Break
}
}
</script>
</body>
Daily Switch Calendar (previous day, next day)
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
