Est ce qu'on peut mettre un calendrier ?

Résolu
desperadosse Messages postés 201 Date d'inscription   Statut Membre Dernière intervention   -  
RAD ZONE Messages postés 5362 Statut Contributeur -
Bonjour,
Excuser moi messieur ,dames.
Est ce qu'on peut mettre un calendrier sur une page html.

Merci d'avances

Desperadosse
Configuration: Windows XP
Firefox 2.0.0.14

6 réponses

  1.
    simm^^ Messages postés 127 Statut Membre 92
     
    Oui !
    0
  2. desperadosse Messages postés 201 Date d'inscription   Statut Membre Dernière intervention   7
     
    Comment fait ton pour en mettre un ?
    0
    1. simm^^ Messages postés 127 Statut Membre 92
       
      Regarde ici : http://www.chezfredo.com/calendriers.php
      0
  3. desperadosse Messages postés 201 Date d'inscription   Statut Membre Dernière intervention   7
     
    Merci beaucoup !!
    0
  4. RAD ZONE Messages postés 5362 Statut Contributeur 1 360
     
    en voila un exemple en javascript 
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">     
  <head>         
    <meta name="generator" content="PSPad editor, www.pspad.com" />         
    <title>    
    </title>    
<script language="JavaScript1.2" type="text/javascript">
//<![CDATA[

    ns4 = (navigator.appName.indexOf("Netscape")>=0 && document.layers)? true : false;
    ie4 = (document.all && !document.getElementById)? true : false;
    ie5 = (document.all && document.getElementById)? true : false;
    ie6 = (document.all && document.getElementById)? true : false;
    ie7 = (document.all && document.getElementById)? true : false;
    ns6 = (document.getElementById && navigator.appName.indexOf("Netscape")>=0 )? true: false;
    w3c = (document.getElementById)? true : false;

    var HTMLCode = "";
    var DaysList = new Array("","Mon","Tue","Wed","Thu","Fri","Sat","Sun");
    var MonthsList = new Array("Mois_Vide","January","Febuary","March","April","May","June","July","August","September","October","November","December");
    var MonthLength = new Array("Mois_longueur_vide",31,29,31,30,31,30,31,31,30,31,30,31);
    var QueryDate = 0;      // Jour demande (date)
    var QueryMonth = 0;     // Mois demande
    var QueryYear = 0;      // Annee demandee
    var QueryDay = 0;       // Jour de la semaine du jour demande, inconnu
    var FirstDay = 0;       // Jour de la semaine du 1er jour du mois
    var WeekRef = 0;        // Numerotation des semaines
    var WeekOne = 0;        // Numerotation des semaines
    var Today = new Date();
    var TodaysYear = Today.getYear();
    var TodaysMonth = Today.getMonth() + 1;
    var TodaysDate = Today.getDate();
    var TodaysDay = Today.getDay() + 1;
    if (TodaysYear < 2000) { TodaysYear += 1900; }
    // On commence par verifier les donnees fournies par l'utilisateur
    function CheckData()
    {
    QueryDate = document.Cal.Date.selectedIndex + 1;
    QueryMonth = document.Cal.Month.selectedIndex + 1;
    QueryYear = (document.Cal.Century.selectedIndex + 15) * 100 + document.Cal.Year.selectedIndex;
    MonthLength[2] = CheckLeap(QueryYear);
    // on teste si la date choisie est anterieure au lundi 20 decembre 1582
    if ((QueryYear * 10000 + QueryMonth * 100 + QueryDate) < 15821220)
    {
    alert("You have chosen a date before Dec 20th 1582.\n\nPlease make another selection.");
    document.Cal.reset();
    CheckData();
    }
    else if (MonthLength[QueryMonth] < QueryDate)       // on verifie si la date est coherente
    {
    alert("Il n'y a pas " + QueryDate + " jours en " + MonthsList[QueryMonth] + " " + QueryYear + " mais " + MonthLength[QueryMonth] + ". \nVeuillez choisir une autre date.");
    document.Cal.reset();
    CheckData();
    }
    else { DisplaySchedule(); }
    }
    // Teste une annee pour determiner si elle est bissextile ou pas
    function CheckLeap(yy)
    {
    if ((yy % 100 != 0 && yy % 4 == 0) || (yy % 400 == 0)) { return 29; }
    else { return 28; }
    }
    // Renvoie le numero de la semaine correspondant a la date requise
    function DefWeekNum(dd)
    {
    numd = 0;
    numw = 0;
    for (n=1; n<QueryMonth; n++)
    {
    numd += MonthLength[n];
    }
    numd = numd + dd - (9 - DefDateDay(QueryYear,1,1));
    numw = Math.floor(numd / 7) + 1;
    if (DefDateDay(QueryYear,1,1) == 1) { numw++; }
    return numw;
    }
    // Renvoie le numero du jour de la semaine correspondant a la date requise
    function DefDateDay(yy,mm,dd)
    {
    return Math.floor((Date2Days(yy,mm,dd)-2) % 7) + 1;
    }
    // Transforme la date en nb de jours theoriques
    function Date2Days(yy,mm,dd)
    {
    if (mm > 2)
    {
    var bis = Math.floor(yy/4) - Math.floor(yy/100) + Math.floor(yy/400);
    var zy = Math.floor(yy * 365 + bis);
    var zm = (mm-1) * 31 - Math.floor(mm * 0.4 + 2.3);
    return (zy + zm + dd);
    }
    else
    {
    var bis = Math.floor((yy-1)/4) - Math.floor((yy-1)/100) + Math.floor((yy-1)/400);
    var zy = Math.floor(yy * 365 + bis);
    return (zy + (mm-1) * 31 + dd);
    }
    }
    // ELEMENT FINDER. BEGIN BG MODIFY
    function findid(name,doc){
    var i,layer;
    for(i=0;i<doc.layers.length;i++){
    layer=doc.layers[i];
    if(layer.name==name)return layer;
    if(layer.document.layers.length>0)if((layer=findid(name,layer.document))!=null)return layer;
    }
    return null;
    }
    // END BG MODIFY
    // Produit le code HTML qui formera le calendrier
    function DisplaySchedule()
    {
    HTMLCode = "<table cellspacing=0 cellpadding=3 border=3 bordercolor=#404056>";
    QueryDay = DefDateDay(QueryYear,QueryMonth,QueryDate);
    WeekRef = DefWeekNum(QueryDate);
    WeekOne = DefWeekNum(1);
    HTMLCode += "<tr align=center><td colspan=8 class=TITRE><b>" + MonthsList[QueryMonth] + " " + QueryYear + "<\/b><\/td><\/tr><tr align=center>";
    for (s=1; s<8; s++)
    {
    if (QueryDay == s) { HTMLCode += "<td width=28><b><font color=#ff6600>" + DaysList[s] + "<\/font><\/b><\/td>"; }
    else { HTMLCode += "<td width=28><b>" + DaysList[s] + "<\/b><\/td>"; }
    }
    HTMLCode += "<td><b><font color=#888888>Week<\/font><\/b><\/td><\/tr>";
    a = 0;
    for (i=(1-DefDateDay(QueryYear,QueryMonth,1)); i<MonthLength[QueryMonth]; i++)
    {
    HTMLCode += "<tr align=center>";
    for (j=1; j<8; j++)
        {
        if ((i+j) <= 0) { HTMLCode += "<td>&nbsp;<\/td>"; }
        else if ((i+j) == QueryDate) { HTMLCode += "<td><b><font color=#ff6600>" + (i+j) + "<\/font><\/b><\/td>"; }
        else if ((i+j) > MonthLength[QueryMonth]) { HTMLCode += "<td>&nbsp;<\/td>"; }
        else { HTMLCode += "<td>" + (i+j) + "<\/td>"; }
        }
    if ((WeekOne+a) == WeekRef) { HTMLCode += "<td><b><font color=#00aa00>" + WeekRef + "<\/font><\/b><\/td>"; }
    else { HTMLCode += "<td><font color=#888888>" + (WeekOne+a) + "<\/font><\/td>"; }
    HTMLCode += "<\/tr>";
    a++;
    i = i + 6;
    }
    // ALLOWS CROSS-BROWSER WRITING IN DOCUMENT. BEGIN BG MODIFY
    if(ie4)document.all['Calendrier'].innerHTML = HTMLCode + "<\/table>";
    if(w3c)document.getElementById('Calendrier').innerHTML= HTMLCode + "<\/table>";
    if(ns4){
    var tns4=findid('Calendrier',document);
    tns4.document.open();
    tns4.document.write('<center>'+HTMLCode+'<\/table><\/center>');
    tns4.document.close();
    }
    // END BG MODIFY
    }
    function Back()
    {
    document.Cal.Month.selectedIndex = document.Cal.Month.selectedIndex - 1;
    if (document.Cal.Month.selectedIndex == -1) { document.Cal.Month.selectedIndex = 11; }
    }
    function Next()
    {
    document.Cal.Month.selectedIndex = document.Cal.Month.selectedIndex + 1;
    if (document.Cal.Month.selectedIndex == -1) { document.Cal.Month.selectedIndex = 0; }
    }
    //EVENT HANDLERS
    window.onload=CheckData;
    if(ns4)window.onresize=function(){
        setTimeout('history.go(0)',400);
        }
    //-->
    //]]>
    </script>         
    <style type="text/css">/*       
      <![CDATA[*/              <!--             body, select, input, table { font-family : Verdana; font-size : 10px; color : #404056; }             .titre { font-family : Verdana; font-size : 12px; color : #404056; }             -->    /*]]>*/          
    </style>         
    <style type="text/css">/*       
      <![CDATA[*/     input.c1 {font-weight: bold}     /*]]>*/          
    </style>     
  </head>     
  <body>    <h3>      Perpetual Calender     </h3>         
    <form name="Cal" id="Cal">      
<script language="JavaScript1.2" type="text/javascript">
//<![CDATA[
      <!--
      // AFFICHE LES 4 MENUS DEROULANTS PERMETTANT DE
      // SELECTIONNER LE JOUR, LE MOIS ET L'ANNEE
      //*************************************************
      DateText = "<select name=\"Date\">"
      for (d=1; d<32; d++)
        {
        DateText += "<option";
        if (d == TodaysDate) { DateText += " SELECTED"; }
        DateText += ">";
        if (d < 10) { DateText += "0"; }
        DateText += d + "<\/option>";
        }
      DateText += "<\/select>";
      //*************************************************
      MonthText = "<select name=\"Month\">"
      for (m=1; m<13; m++)
        {
        MonthText += "<option";
        if (m == TodaysMonth) { MonthText += " SELECTED"; }
        MonthText += ">";
        MonthText += MonthsList[m] + "<\/option>";
        }
      MonthText += "<\/select>";
      //*************************************************
      CenturyText = "<select name=\"Century\">"
      for (c=15; c<25; c++)
        {
        CenturyText += "<option";
        if (c == Math.floor(TodaysYear / 100)) { CenturyText += " SELECTED"; }
        CenturyText += ">" + c + "<\/option>";
        }
      CenturyText += "<\/select>";
      //*************************************************
      YearText = "<select name=\"Year\">";
      for (y=0; y<100; y++)
        {
        YearText += "<option";
        if (y == (TodaysYear - Math.floor(TodaysYear / 100) * 100)) { YearText += " SELECTED"; }
        YearText += ">";
        if (y < 10) { YearText += "0"; }
        YearText += y + "<\/option>";
        }
      YearText += "<\/select>";
      //*************************************************
      document.write(MonthText+' '+DateText+', '+CenturyText+' '+YearText);
      //-->
      //]]>
      </script>        
      <input type="button" value=" OK " class="c1" onclick="CheckData()" /><br />      <br />             
      <input type="button" value="<< Month" class="c1" onclick="Back(); CheckData()" />             
      <input type="button" value=" Return to today's date... " class="c1" onclick=       "document.Cal.reset(); setTimeout('CheckData()',100)" />        
      <input type="button" value=       "Month >>" class="c1" onclick="Next();CheckData()" /><br />      <br />      <br />      
<script language="javascript1.2" type="text/javascript">
//<![CDATA[
      if(ns4)document.write('<layer name="Calendrier"><\/layer><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>')
      else document.write('<div id="Calendrier"><\/div>');
      //]]>
      </script>         
    </form><br />     
  </body>
</html>
    0

  5. Vous n’avez pas trouvé la réponse que vous recherchez ?

    Posez votre question
  6. Océane
     
    Bonjour es ce que les cadre sont gratuits ?????????????????????????? merci beaucoup merci tous plein
    0
  7. RAD ZONE Messages postés 5362 Statut Contributeur 1 360
     
    Bonjour es ce que les cadre sont gratuits ??????????

    Quel cadres ???
    0

Discussions similaires

Calendrier échéancier
excellll -
excellll -

13 réponses