JS简易日历

来源:互联网 发布:python count函数 编辑:程序博客网 时间:2024/05/21 15:40
<!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><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><style>#divHead{width:790px;height:430px;text-align:center;background-color:#000000;color:#FFFFFF;}#divHead ul li{margin:2px 2px;display:block;width:220px;height:100px;float:left;border:2px solid white;}#bottom{margin:0px 0px 0px 0px;width:790px;height:180px;border:0px solid white;background-color:#000000;color:white;text-align:center;}.active{color:red;}</style><script>window.onload=function(){var oDiv=document.getElementById("divHead");var liCh=oDiv.getElementsByTagName("li");var innerDiv=document.getElementById("bottom");var arr=["1月,让自己取得好成绩","2月,保持良好的情绪","3月,开心每一天","4月,活力起来","5月,加油","6月,倘不奋发,惟有失败,顾影自怜","7月,以情恕人,以理律已","8月,happiness","9月,科学和艺术是一枚硬币的两面","10月,漂亮","11月,拼搏的汗水放射着事业的光芒,奋斗的年华里洋溢着人生的欢乐。 ","12月书籍是朋友,虽然没有热情,但是非常忠实,"]for(var i=0;i<liCh.length;i++){liCh[i].index=i;liCh[i].onmouseover=function(){for(var j=0;j<liCh.length;j++){liCh[j].className="";}this.className="active";innerDiv.innerHTML="<h2>"+(this.index+1)+"月活动</h2>"+arr[(this.index)];}}}</script></head><body><div id="divHead"><ul><li class="active"><h2>1</h2>January</li><li><h2>2</h2>February</li><li><h2>3</h2>March</li><li><h2>4</h2>April</li><li><h2>5</h2>May</li><li><h2>6</h2>June</li><li><h2>7</h2>July</li><li><h2>8</h2>August</li><li><h2>9</h2>September</li><li><h2>10</h2>October</li><li><h2>11</h2>November</li><li><h2>12</h2>December</li></ul></div><div id="bottom"></div></body></html>

原创粉丝点击