【图】HTML组件(HTML COMPONENTS)之六

====日历主页面===

<head <titleCalendar Example</title <?IMPORT NAMESPACE="MYCAL" IMPLEMENTATION="calendar.htc"/ </HEAD <BODY <PClick a day in the calendar to add or modify your schedule.</P <MYCAL:CALENDAR</MYCAL:CALENDAR </BODY </HTML

　===CALENDAR HTC===

<HEAD <?IMPORT NAMESPACE="ANYDAY" IMPLEMENTATION="day.htc"/ <?IMPORT NAMESPACE="TODAY" IMPLEMENTATION="today.htc"/ <PUBLIC:COMPONENT tagName="CALENDAR" <ATTACH EVENT="oncontentready" ONEVENT="fnInit()"/ </PUBLIC:COMPONENT <SCRIPT LANGUAGE="JavaScript" <!-- function fnInit() { defaults.viewLink = document; } // -- </SCRIPT <STYLE TD { background-color:tan; width:50; height:50; } </STYLE </HEAD <BODY <SCRIPT LANGUAGE="JavaScript" <!-- // Copyright 1997 -- Tomer Shiran setCal(); function leapYear(year) { if (year % 4 == 0) {// basic rule return true; // is leap year } /* else */ // else not needed when statement is "return" return false; // is not leap year } function getDays(month, year) { // create array to hold number of days in each month var ar = new Array(12); ar[0] = 31; // January ar[1] = (leapYear(year)) ? 29 : 28; // February ar[2] = 31; // March ar[3] = 30; // April ar[4] = 31; // May ar[5] = 30; // June ar[6] = 31; // July ar[7] = 31; // August ar[8] = 30; // September ar[9] = 31; // October ar[10] = 30; // November ar[11] = 31; // December // return number of days in the specified month (parameter) return ar[month]; } function getMonthName(month) { // create array to hold name of each month var ar = new Array(12); ar[0] = "January"; ar[1] = "February"; ar[2] = "March"; ar[3] = "April"; ar[4] = "May"; ar[5] = "June"; ar[6] = "July"; ar[7] = "August"; ar[8] = "September"; ar[9] = "October"; ar[10] = "November"; ar[11] = "December"; // return name of specified month (parameter) return ar[month]; } function setCal() { // standard time attributes var now = new Date(); var year = now.getFullYear(); var month = now.getMonth(); var monthName = getMonthName(month); var date = now.getDate(); now = null; // create instance of first day of month, and extract the day on which it occurs var firstDayInstance = new Date(year, month, 1); var firstDay = firstDayInstance.getDay(); firstDayInstance = null; // number of days in current month var days = getDays(month, year); // call function to draw calendar drawCal(firstDay + 1, days, date, monthName, year); } function drawCal(firstDay, lastDate, date, monthName, year) { // constant table settings //var headerHeight = 50 // height of the table's header cell var border = 2; // 3D height of table's border var cellspacing = 4; // width of table's border var headerColor = "midnightblue"; // color of table's header var headerSize = "+3"; // size of tables header font var colWidth = 60; // width of columns in table var dayCellHeight = 25; // height of cells containing days of the week var dayColor = "darkblue"; // color of font representing week days var cellHeight = 40; // height of cells representing dates in the calendar var todayColor = "red"; // color specifying today's date in the calendar var timeColor = "purple"; // color of font representing current time // create basic table structure var text = ""; // initialize accumulative variable to empty string text += '<TABLE BORDER=' + border + ' CELLSPACING=' + cellspacing + ''; // table settings text += '<TH COLSPAN=7 HEIGHT=' + 10 + ''; // create table header cell text += '<FONT COLOR="' + headerColor + '" SIZE=' + headerSize + ''; // set font for table header text += monthName + ' ' + year; text += '</FONT'; // close table header's font settings text += '</TH'; // close header cell // variables to hold constant settings var openCol = '<TD WIDTH=' + colWidth </article> </section> <section class="article-more"> <div class="rel mask-box"> <div class="content-mask"></div> <div class="content-more js-content-more">展开更多 <span>（<span class="cont-remain">50</span>%）</span> <i class="icon-arrow"></i> </div> </div> <div class="gg show-pageup" data-id="pageup"></div> <div class="soshm-box"> <div class="soshm-title"><span>分享</span></div> <div id="soshm-box"></div> </div> <div class="gg show-pagedown" data-id="pagedown"></div> <div id="wechat"></div> </section><section class="section you-like"> <header class="section-header"> <h3 class="section-title">猜你喜欢</h3> <div class="section-toolbar"> <a class="section-more" href="javascript:;" title="查看更多相关文章"> <span></span> <span></span> <span></span> </a> </div> </header> <div id="bd-recommend"></div> <div class="article-list"> <div class="article-item"> <div class="article-grouper"> <h4 class="article-item-title"><a href="http://m.tulaoshi.com/n/20160129/1483508.html" title="HTML组件(HTML COMPONENTS)之六">HTML组件(HTML COMPONENTS)之六</a></h4> <div class="article-item-meta"> <a href="http://m.tulaoshi.com/html/" target="_blank">Html</a> <a href="http://m.tulaoshi.com/cssbuju/" target="_blank">CSS布局</a> <a href="http://m.tulaoshi.com/divcss/" target="_blank">Div+CSS</a> <a href="http://m.tulaoshi.com/xhtml/" target="_blank">XHTML</a> </div> </div> <div class="article-item-thumb"> <a href="http://m.tulaoshi.com/n/20160129/1483508.html" title="HTML组件(HTML COMPONENTS)之六"><img class="lazyload cover-img" src="http://i1.tulaoshi.com/images/lazy-spinner.jpg" data-src="http://img.tulaoshi.com/201601/29/bf50c6bed9f2ae0d8e4af95d5d514e0d_thumb_189.jpg" alt="HTML组件(HTML COMPONENTS)之六"></a> </div> </div> <div class="article-item"> <div class="article-grouper"> <h4 class="article-item-title"><a href="http://m.tulaoshi.com/n/20160129/1483967.html" title="HTML组件(HTML COMPONENTS)之十">HTML组件(HTML COMPONENTS)之十</a></h4> <div class="article-item-meta"> <a href="http://m.tulaoshi.com/html/" target="_blank">Html</a> <a href="http://m.tulaoshi.com/cssbuju/" target="_blank">CSS布局</a> <a href="http://m.tulaoshi.com/divcss/" target="_blank">Div+CSS</a> <a href="http://m.tulaoshi.com/xhtml/" target="_blank">XHTML</a> </div> </div> <div class="article-item-thumb"> <a href="http://m.tulaoshi.com/n/20160129/1483967.html" title="HTML组件(HTML COMPONENTS)之十"><img class="lazyload cover-img" src="http://i1.tulaoshi.com/images/lazy-spinner.jpg" data-src="http://img.tulaoshi.com/201601/29/98a8c667b5e6cef9da88aad0f49390ea_thumb_189.jpg" alt="HTML组件(HTML COMPONENTS)之十"></a> </div> </div> <div class="gg" data-id="content1"></div> <div class="article-item"> <div class="article-grouper"> <h4 class="article-item-title"><a href="http://m.tulaoshi.com/n/20171117/2766281.html" title="s8lol主宰符文怎么配">s8lol主宰符文怎么配</a></h4> <div class="article-item-meta"> <a href="http://m.tulaoshi.com/yingxionglianmeng/" target="_blank">英雄联盟</a> <a href="http://m.tulaoshi.com/wangluoyouxi/" target="_blank">网络游戏</a> </div> </div> <div class="article-item-thumb"> <a href="http://m.tulaoshi.com/n/20171117/2766281.html" title="s8lol主宰符文怎么配"><img class="lazyload cover-img" src="http://i1.tulaoshi.com/images/lazy-spinner.jpg" data-src="http://img.tulaoshi.com/201711/17/2b6780a6d697ab474ec43d2b143a8c33.jpg" alt="s8lol主宰符文怎么配"></a> </div> </div> <div class="article-item"> <div class="article-grouper"> <h4 class="article-item-title"><a href="http://m.tulaoshi.com/n/20160129/1483987.html" title="HTML组件(HTML COMPONENTS)之十一">HTML组件(HTML COMPONENTS)之十一</a></h4> <div class="article-item-meta"> <a href="http://m.tulaoshi.com/html/" target="_blank">Html</a> <a href="http://m.tulaoshi.com/cssbuju/" target="_blank">CSS布局</a> <a href="http://m.tulaoshi.com/divcss/" target="_blank">Div+CSS</a> <a href="http://m.tulaoshi.com/xhtml/" target="_blank">XHTML</a> </div> </div> <div class="article-item-thumb"> <a href="http://m.tulaoshi.com/n/20160129/1483987.html" title="HTML组件(HTML COMPONENTS)之十一"><img class="lazyload cover-img" src="http://i1.tulaoshi.com/images/lazy-spinner.jpg" data-src="http://img.tulaoshi.com/201601/29/0bae33fb05e2196590cec50e44dc494e_thumb_189.jpg" alt="HTML组件(HTML COMPONENTS)之十一"></a> </div> </div> <div class="article-item"> <div class="article-grouper"> <h4 class="article-item-title"><a href="http://m.tulaoshi.com/n/20160129/1483535.html" title="HTML组件(HTML COMPONENTS)之四">HTML组件(HTML COMPONENTS)之四</a></h4> <div class="article-item-meta"> <a href="http://m.tulaoshi.com/html/" target="_blank">Html</a> <a href="http://m.tulaoshi.com/cssbuju/" target="_blank">CSS布局</a> <a href="http://m.tulaoshi.com/divcss/" target="_blank">Div+CSS</a> <a href="http://m.tulaoshi.com/xhtml/" target="_blank">XHTML</a> </div> </div> <div class="article-item-thumb"> <a href="http://m.tulaoshi.com/n/20160129/1483535.html" title="HTML组件(HTML COMPONENTS)之四"><img class="lazyload cover-img" src="http://i1.tulaoshi.com/images/lazy-spinner.jpg" data-src="http://img.tulaoshi.com/201601/29/bf97a878f2c61a3146d54e0ff6caddef_thumb_189.jpg" alt="HTML组件(HTML COMPONENTS)之四"></a> </div> </div> <div class="gg" data-id="content2"></div> <div class="article-item"> <div class="article-grouper"> <h4 class="article-item-title"><a href="http://m.tulaoshi.com/n/20171116/2766194.html" title="lol偷钱流符文搭配推荐">lol偷钱流符文搭配推荐</a></h4> <div class="article-item-meta"> <a href="http://m.tulaoshi.com/yingxionglianmeng/" target="_blank">英雄联盟</a> <a href="http://m.tulaoshi.com/wangluoyouxi/" target="_blank">网络游戏</a> </div> </div> <div class="article-item-thumb"> <a href="http://m.tulaoshi.com/n/20171116/2766194.html" title="lol偷钱流符文搭配推荐"><img class="lazyload cover-img" src="http://i1.tulaoshi.com/images/lazy-spinner.jpg" data-src="http://img.tulaoshi.com/201711/16/68ce3c7443802f29f089fd2b8aeacfac.jpg" alt="lol偷钱流符文搭配推荐"></a> </div> </div> <div class="article-item"> <div class="article-grouper"> <h4 class="article-item-title"><a href="http://m.tulaoshi.com/n/20160129/1483493.html" title="HTML组件(HTML COMPONENTS)之七">HTML组件(HTML COMPONENTS)之七</a></h4> <div class="article-item-meta"> <a href="http://m.tulaoshi.com/html/" target="_blank">Html</a> <a href="http://m.tulaoshi.com/cssbuju/" target="_blank">CSS布局</a> <a href="http://m.tulaoshi.com/divcss/" target="_blank">Div+CSS</a> <a href="http://m.tulaoshi.com/xhtml/" target="_blank">XHTML</a> </div> </div> <div class="article-item-thumb"> <a href="http://m.tulaoshi.com/n/20160129/1483493.html" title="HTML组件(HTML COMPONENTS)之七"><img class="lazyload cover-img" src="http://i1.tulaoshi.com/images/lazy-spinner.jpg" data-src="http://img.tulaoshi.com/201601/29/91141ce27831ceefddd036fe44cea87e_thumb_189.jpg" alt="HTML组件(HTML COMPONENTS)之七"></a> </div> </div> <div class="article-item"> <div class="article-grouper"> <h4 class="article-item-title"><a href="http://m.tulaoshi.com/n/20160129/1483960.html" title="HTML组件(HTML COMPONENTS)之九">HTML组件(HTML COMPONENTS)之九</a></h4> <div class="article-item-meta"> <a href="http://m.tulaoshi.com/html/" target="_blank">Html</a> <a href="http://m.tulaoshi.com/cssbuju/" target="_blank">CSS布局</a> <a href="http://m.tulaoshi.com/divcss/" target="_blank">Div+CSS</a> <a href="http://m.tulaoshi.com/xhtml/" target="_blank">XHTML</a> </div> </div> <div class="article-item-thumb"> <a href="http://m.tulaoshi.com/n/20160129/1483960.html" title="HTML组件(HTML COMPONENTS)之九"><img class="lazyload cover-img" src="http://i1.tulaoshi.com/images/lazy-spinner.jpg" data-src="http://img.tulaoshi.com/201601/29/a0e7898b38915fa70679da46aaac7b8e_thumb_189.jpg" alt="HTML组件(HTML COMPONENTS)之九"></a> </div> </div> <div class="gg" data-id="content3"></div> <div class="article-item"> <div class="article-grouper"> <h4 class="article-item-title"><a href="http://m.tulaoshi.com/n/20171116/2766140.html" title="lolAD刺客新符文搭配推荐">lolAD刺客新符文搭配推荐</a></h4> <div class="article-item-meta"> <a href="http://m.tulaoshi.com/yingxionglianmeng/" target="_blank">英雄联盟</a> </div> </div> <div class="article-item-thumb"> <a href="http://m.tulaoshi.com/n/20171116/2766140.html" title="lolAD刺客新符文搭配推荐"><img class="lazyload cover-img" src="http://i1.tulaoshi.com/images/lazy-spinner.jpg" data-src="http://img.tulaoshi.com/201711/16/bd0c64bbcf0c4a08cdc15ba757ac2fa3.jpg" alt="lolAD刺客新符文搭配推荐"></a> </div> </div> <div class="article-item"> <div class="article-grouper"> <h4 class="article-item-title"><a href="/n/20160129/1483507.html">AutoCAD实用教程：欧式橱柜门板的建模方法</a></h4> </div> <div class="article-item-thumb"> <a href="/n/20160129/1483507.html" title="AutoCAD实用教程：欧式橱柜门板的建模方法"><img class="lazyload cover-img" src="http://i1.tulaoshi.com/images/lazy-spinner.jpg" data-src="http://img.tulaoshi.com/201601/29/82c4cb62bf9bdfe1162f941d132f3b62_thumb_189.jpg" alt="AutoCAD实用教程：欧式橱柜门板的建模方法"></a> </div> </div> <div class="article-item"> <div class="article-grouper"> <h4 class="article-item-title"><a href="/n/20160129/1483509.html">HTML语言剖析（十一）排版标记</a></h4> </div> <div class="article-item-thumb"> <a href="/n/20160129/1483509.html" title="HTML语言剖析（十一）排版标记"><img class="lazyload cover-img" src="http://i1.tulaoshi.com/images/lazy-spinner.jpg" data-src="http://img.tulaoshi.com/201601/29/56aea696e3e59385ad9ccdd981cf64ae_thumb_189.jpg" alt="HTML语言剖析（十一）排版标记"></a> </div> </div> <div class="gg" data-id="content4"></div> </div> </section> <div class="loadbox"> <div class="load-btn">下拉加载更多内容 ↓</div> <div class="icon-loading"></div> </div> <div class="gg show-banner2" data-id="banner2"></div> <div class="gg show-foot" data-id="foot"></div> </section> <footer id="footer" class="site-footer"> <ul class="footer-nav"> <li><a href="/" title="图老师首页">首页</a></li> <li><a href="/diannao/sitemap/" title="地图">地图</a></li> <li><a href="/update/6/" title="最新">最新</a></li> </ul> </footer> <div id="fixed-box" class="js-insert-box" data-id="fixed"></div> <script src="http://i1.tulaoshi.com/js/mobile.js"></script> <script type="application/ld+json"> { "@context": "https://ziyuan.baidu.com/contexts/cambrian.jsonld", "@id": "http://m.tulaoshi.com/n/20160129/1483508.html", "appid": "1556758182286999", "title": "HTML组件(HTML COMPONENTS)之六", "images": [ "http://img.tulaoshi.com/201601/29/bf50c6bed9f2ae0d8e4af95d5d514e0d_thumb_189.jpg" ], "description": "HTML组件(HTML COMPONENTS)之六,HTML组件(HTML COMPONENTS)之六 ", "pubDate": "2016-01-29T11:49:59" } </script></body></html>