カレンダーの表示を以下のスクリプトと他cssコードで表示しています。
これだと、正常にカレンダーは表示されますが、特定の日時にハイライトや、見た目の装飾がこのままだと出来ません。
例えば、休業日となる
年末年始の12月30日から1月3日の間は赤字に設定したい場合、どの様にいじれば良いでしょうか?
jQueryでそんな便利な物もあるかもしれませんが、javascriptの勉強も兼ねて知りたいので、知識をお持ちでお付き合い頂ける方、教えて下さい。
よろしくお願い致します。
html
1<script src="../js/calendar.js"></script>
javascript
1 2/*====================== 3日付の取得 4======================*/ 5var Years = new Date(); 6var Toshi = Years.getFullYear(); 7var Tsuki = Years.getMonth() + 1; 8var dayLoad = Years.getDate(); 9/*====================== 10Calendar 11======================*/ 12myWeekTbl = new Array("日","月","火","水","木","金","土"); 13myMonthTbl= new Array(31,28,31,30,31,30,31,31,30,31,30,31); 14 15if (((Toshi%4)==0 && (Toshi%100)!=0) || (Toshi%400)==0){ 16 myMonthTbl[1] = 29; 17} 18myMonth = Years.getMonth(); 19dayLoad = Years.getDate(); 20Years.setDate(1); 21myWeek = Years.getDay(); 22myTblLine = Math.ceil((myWeek+myMonthTbl[myMonth])/7); 23myTable = new Array(7*myTblLine); 24 for(i=0; i<7*myTblLine; i++) myTable[i]=" "; 25 for(i=0; i<myMonthTbl[myMonth]; i++)myTable[i+myWeek]=i+1; 26 27function loadCalendar() { 28 document.write("<div class='loadCalendarWrapper'><table border='1' class='loadCalendarTable'>"); 29 document.write("<tr><td colspan='7' bgcolor='#2a2e3e'>"); 30 document.write("<span class='loadCalendarTitle'>", (myMonth+1),"月"+"営業日カレンダー</span>"); 31 document.write("</td></tr>"); 32 document.write("<tr>"); 33 for(i=0; i<7; i++){ 34 document.write("<td align='center' "); 35 if(i==0)document.write("bgcolor='#fa8072'>"); 36 else document.write("bgcolor='#f3f3f3'>"); 37 document.write("<strong>",myWeekTbl[i],"</strong>"); 38 document.write("</td>"); 39 } 40 document.write("</tr>"); 41 for(i=0; i<myTblLine; i++){ 42 document.write("<tr>"); 43 for(j=0; j<7; j++){ 44 document.write("<td align='center' "); 45 myDat = myTable[j+(i*7)]; 46 if (myDat==dayLoad)document.write("style='color:#fff;' bgcolor='#007cf9'"); 47 else if(j==0) document.write("bgcolor='#FF33CC'>"); 48 else document.write("bgcolor='#fff'>"); 49 document.write("<strong>",myDat,"</strong>"); 50 document.write("</td>"); 51 } 52 document.write("</tr>"); 53 } 54 document.write("</table><div class='hosoku'><span class='HolidayMark'>■</span>は休業日です</div></div>"); 55} 56
回答3件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。