手机版

纯射流研究…简单日历实现代码

时间:2021-11-15 来源:互联网 编辑:宝哥软件园 浏览:

复制代码代码如下:文档类型html标题/title meta http-equiv=' Content-Type ' Content=' text/html;charset=utf-8 '/style type=' text/CSS ' body,ul,li,h2,p { margin :0 pxpadding :0 XP } # div 1 { width :200 px高度:200 px背景# ccc}。日历{ width :240 pxh three :345 px背景# cccmargin:auto}。日历ul {列表式:无;宽度宽度:232px高度:260 pxmargin:0pxpadding:0px}。日历ul Li { width :45 pxh8 :65 px背景技术: # 333;float : leftisplay : inline左边距left :11 pxmargin-top :10 px;border:1px固体# ccc文本对齐:居中;颜色: # FFF;} .calendar ul Li :悬停{边框:1 px实心# 000;} .文本{ background : # f96 margin 336010 xpadding-bottom :10 px;高度:45px}。文本h2 { display:inline}。活动{ background:#FFF!重要;color:#C03!重要;}/style脚本类型=' text/JavaScript '/* window。onload=function(){ var OBtn=document。getelementbyid(' BTN 1 ');var oTxt=文档。getelementbyid(' txt 1 ');var oDiv=文档。getelementbyid(' div 1 ');奥宾。onclick=function(){ odiv。innerhtml=otxt。价值;} } */窗口。onload=function(){ var AlI=document。getelementsbytagname(' Li ');var Oxt=文档。GetElementByID(' tab ').getElementsByTagName(' div ')[0];var aDats=['元旦一月一日','2月14日情人节','3月3日全国爱耳日', '4月一日愚人节','5月一日国际劳动节','6月一日国际儿童节', '7月一日中国共产党诞生日','8月一日中国人民解放军建军节','9月10日中国教师节', '10月一日中华人民共和国国庆节','11月9日消防宣传日','12月3日世界残疾人日' ];var I=0;for(I=0;iaLi.lengthI)//用于循环历遍里元素aLi[i].索引=我;aLi[i].onmouseover=function() //添加鼠标指向事件{ for(I=0;iaLi.lengthI)//用于循环历遍里元素去掉里样式aLi[i].class NAmE=} this . class NAmE=' active//给当前标签添加活跃的样式otxt。innerhtml=' H2 '(这。索引1)'/H2 ' '月“p”ADAts[这个。索引]"/p ";} } };/script/head body div id=' tab ' class=' calendar ' ul Li class=' active ' h21/h2pJAN/p/Li Li 22/h2p fer/p/Li Li 23/h2p mar/p/Li Li 24/h2pAPR/p/Li Li 25/h2p may/p/Li Li 26/h2pJUM/p/李丽丽27/h2pJUL/p/李丽丽28/h2pAUG/p/李丽丽Li 29/h2pSEP/p/李丽丽210/效果预览

版权声明:纯射流研究…简单日历实现代码是由宝哥软件园云端程序自动收集整理而来。如果本文侵犯了你的权益,请联系本站底部QQ或者邮箱删除。