Discussion :

[LE NEINDRE]

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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.

[malbaladejo]

Pour changer la couleur de fond d'un tr je fais ca :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<tr onmouseover="this.className='fondbleulight'" onmouseout="this.className=''">

Dans ton cas essais donc ca

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.getElementById(cell).className="Calendrier_DayOff";

[LE NEINDRE]

Ah oui, ça marche ça !!!
Merci bien !!!

[malbaladejo]

si je peux aider...

[LE NEINDRE]

oui merci, tiens si tu veux encore m'aider, je viens de reposer une question sur le forum.
Le titre c'est: onMouseOver
(je fais de la pub pour mon post) !!

;o)))))))