Changer le style d'une cellule
Bonjour à tous !
Voilà mon problème.
Je veux réaliser un petit calendrier
J'ai un tableau dont chaque cellule est identifiée par un id.
Je voudrais changé le style de tous les cases samedi-dimanche.
Voilà mon script:
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27
|
<TABLE width=100% border=0 cellspacing=1>
<TR>
<script>
for(i=0;i<7;i++)
{
document.write("<TD class='Calendrier_Jour'>"+WeekDay[i]+"</TD>");
}
</script>
</TR>
<script>
for(i=0;i<6;i++)
{
document.write("<TR height=15>\t");
for(j=0;j<7;j++)
{
cell='cell'+i+""+j;
document.write("<TD class='Calendrier' width='14%' id='"+cell+"' onMouseOver=\"this.className='Calendrier_over'\" onMouseOut=\"this.className='Calendrier'\" onclick=\"ReturnValue("+i+","+j+")\">cell"+i+""+j+"</TD>\t");
}
document.write("</TR>\t");
}
</script>
</TABLE> |
Et voici ma fonction qui calcul les dates:
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49
|
function SwitchMonth(ThisMonth,mode)
{
for(i=0;i<6;i++)
{
for(j=0;j<7;j++)
{
document.getElementById('cell'+i+""+j).innerHTML="";
}
}
ThisYear=CurrentYear;
if(ThisMonth>11 && mode=='next')
{
ThisYear++;
ThisMonth=0;
}
if(ThisMonth<0 && mode=='previous')
{
ThisYear--;
ThisMonth=11;
}
document.getElementById('mois').innerHTML="<p align='center'><font size=1 family='tahoma'><b>"+Month[ThisMonth]+" "+ThisYear+"</b></font></p>";
CurrentMonth=ThisMonth;
CurrentYear=ThisYear;
var NbJours=NbJourMonth[ThisMonth];
if(ThisYear%4==0 && ThisMonth==1)
{
NbJours++;
}
FirstDate=new Date(ThisYear,ThisMonth,1);
FirstDay=FirstDate.getDay();
FirstDay=(FirstDay+6)%7;
for(i=1;i<=NbJours;i++)
{
var ThisDate=new Date(ThisYear,ThisMonth,i);
var ThisDay=ThisDate.getDay();
ThisDay=(ThisDay+6)%7;/* Tableau va du dimanche au samedi: dimanche->0 samedi->6 Nous on veut lundi->0 dimanche 6, d'où (+6%7)*/
var ThisMonth=ThisDate.getMonth();
var ThisYear=ThisDate.getYear();
var cell='cell'+Math.floor((i-1+FirstDay)/7)+""+ThisDay;
document.getElementById(cell).innerHTML=i;
if(ThisDay==5 || ThisDay==6)
{
document.getElementById(cell).style.className="Calendrier_DayOff";
}
}
} |
Voilà la ligne:
Code:
1 2
|
document.getElementById(cell).style.className="Calendrier_DayOff"; |
Ne change pas mon style, et je suis sûr que ma classe Calendrier_DayOff fonctionne bien. Y a surement une erreur que je ne comprends pas ???
Merci pour votre aide.