清明作业
<!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 type="text/css"> *{ margin:0px auto; } #e{ widtj:100px; height:50px; } .xiang{ width:100px; height:50px; background-color:blue; text-align:center; vertical-align:middle; line-height:50px; color:#fff; border:1px solid #CCC } </style> </head> <body> <div id="e"> <div class="xiang" onmousemove="Bian(this)" onclick="Dian(this)" onmouseout="Hui()" >李四</div> <div class="xiang" onmousemove="Bian(this)" onclick="Dian(this)" onmouseout="Hui()" >王五</div> <div class="xiang" onmousemove="Bian(this)" onclick="Dian(this)" onmouseout="Hui()" >赵六</div> </div> <script type="text/javascript"> function Bian(a) { var xiang = document.getElementsByClassName("xiang"); for(var i=0;i<xiang.length;i++) { xiang[i].style.backgroundColor = "#03C"; xiang[i].removeAttribute("as"); } a.style.backgroundColor = "red"; a.setAttribute("as",1); } function Dian(a) { var xiang = document.getElementsByClassName("xiang"); for(var i=0;i<xiang.length;i++) { if(xiang[i].getAttribute("as")!=1) { xiang[i].style.backgroundColor = "#03C"; } } a.style.backgroundColor = "red"; } function Hui() { var xiang= document.getElementsByClassName("xiang"); for(var i=0;i<xiang.length;i++) { if(xiang[i].getAttribute("as")!=1) { xiang[i].style.backgroundColor = "#03C"; } } } function Hui() { window.scrollTo(0,200); } </script> </html>
顶部
<!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 type="text/css"> *{ margin:0px auto;} /*#kuang{ 100px; height:50px;} .list{ 100px; height:50px; background-color:#03C; text-align:center; vertical-align:middle; line-height:50px; color:#fff; border:1px solid #CCC} */ </style> </head> <body> <!--<div id="kuang"> <div class="list" onclick="Xuan(this)" onmouseover="Bian(this)" onmouseout="Hui()">深圳</div> <div class="list" onclick="Xuan(this)" onmouseover="Bian(this)" onmouseout="Hui()">北京</div> <div class="list" onclick="Xuan(this)" onmouseover="Bian(this)" onmouseout="Hui()">上海</div> </div>--> <div id="l" style="100%; height:200px; background-color:red;"></div> <div id="caidan" style="100%; height:100px; background-color:blue;"></div> <div style="100%; height:1000px; background-color:#000;"></div> <input type="button" value="an" onclick="Hui()" /> </body> <script type="text/javascript"> /*function Xuan(a) { var list = document.getElementsByClassName("list"); //清一下(回复原样式) for(var i=0;i<list.length;i++) { list[i].style.backgroundColor = "#03C"; list[i].removeAttribute("as"); } //选择变色 a.style.backgroundColor = "red"; a.setAttribute("as",1); } function Bian(a) { var list = document.getElementsByClassName("list"); //清一下(回复原样式) for(var i=0;i<list.length;i++) { if(list[i].getAttribute("as")!=1) { list[i].style.backgroundColor = "#03C"; } } //选择变色 a.style.backgroundColor = "red"; } function Hui() { var list = document.getElementsByClassName("list"); //清一下(回复原样式) for(var i=0;i<list.length;i++) { if(list[i].getAttribute("as")!=1) { list[i].style.backgroundColor = "#03C"; } } }*/ /*function Hui() { window.scrollTo(0,200); }*/ window.onscroll = function() { var c = document.getElementById("caidan"); //var ch = c.style.height; var l = document.getElementById("l"); var lh = l.style.height; //parseInt(ch); if(window.scrollY >= parseInt(lh)) { //超出的范围操作 c.style.position = "fixed"; c.style.top = "0px"; } else { //没有超出的范围操作 c.style.position = "relative"; } } </script> </html>
时间日期
<!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 type="text/css"> </style> </head> <body> <select id="nian" onclick="Bian()"></select>年 <select id="yue" onclick="Bian()"></select>月 <select id="ri"></select>日 </body> <script type="text/javascript"> Nian(); Yue(); Tian(); function Nian() { var d = new Date(); var n = parseInt(d.getFullYear()); var str = ""; for(var i=n-5;i<n+6;i++) { if(i==n) { str += "<option selected='selected'>"+i+"</option>"; } else { str += "<option>"+i+"</option>"; } } document.getElementById("nian").innerHTML = str; } function Yue() { var d = new Date(); var y = parseInt(d.getMonth()+1); var str = ""; for(var i=1;i<13;i++) { if(i==y) { str += "<option selected='selected'>"+i+"</option>"; } else { str += "<option>"+i+"</option>"; } } document.getElementById("yue").innerHTML = str; } function Tian() { var d = new Date(); var t = parseInt(d.getDate()); var n = document.getElementById("nian").value; var y = document.getElementById("yue").value; //alert(n); var ts = 31; //30天 if(y==4 || y==6 || y==9 || y==11) { ts = 30; } if(y==2) { if((n%4==0 && n%100!=0) || n%400==0) { ts=29; } else { ts=28; } } var str = ""; for(var i=1;i<ts+1;i++) { if(i==t) { str += "<option selected='selected'>"+i+"</option>"; } else { str += "<option>"+i+"</option>"; } } document.getElementById("ri").innerHTML = str; } function Bian() { Tian(); } </script> </html>