Couleurs différentes dans calendrier sur base du contenu

[xderass]

Bonjour

J’essaye d’appliquer la dernière proposition de milouze14 de ce sujet :

https://forum.forumactif.com/t378943-couleur-differentes-dans-le-calendrier?highlight=calendrier

J’ai modifié certains « contains » en fonction des couleurs choisies laissant les autres lignes pour d’autres possibilités de couleurs mais pas de résultat dans mon calendrier qui reste immuable :

Voici le code Javascript que je tente de faire fonctionner :

Code:

if(location.pathname == '/calendar')
    $(function(){
    $('tr[valign="top"]').addClass('M14_Calendar');
    $('tr.M14_Calendar a.genmed:contains("Arène cata Alpha")').css('color','blue');
    $('tr.M14_Calendar a.genmed:contains("Quête d'alliance")').css('color','green');
    $('tr.M14_Calendar a.genmed:contains("Le 3")').css('color','maroon');
    $('tr.M14_Calendar a.genmed:contains("Event obligatoire")').css('color','fuchsia');
    $('tr.M14_Calendar a.genmed:contains("Le 5")').css('color','yellow');
    $('tr.M14_Calendar a.genmed:contains("Le 6")').css('color','pink');
    $('tr.M14_Calendar a.genmed:contains("Le 7")').css('color','purple');
    $('tr.M14_Calendar a.genmed:contains("Arène cata 4*")').css('color','orange');
    $('tr.M14_Calendar a.genmed:contains("Le 9")').css('color','LightCoral');
    $('tr.M14_Calendar a.genmed:contains("Le 10")').css('color','OliveDrab');
    $('tr.M14_Calendar a.genmed:contains("Le 11")').css('color','RosyBrown');
    $('tr.M14_Calendar a.genmed:contains("Le 12")').css('color','VioletRed');
    $('tr.M14_Calendar a.genmed:contains("Le 13")').css('color','SaddleBrown');
    $('tr.M14_Calendar a.genmed:contains("Le 14")').css('color','Teal');
    $('tr.M14_Calendar a.genmed:contains("Le 15")').css('color','SeaGreen');
    $('tr.M14_Calendar a.genmed:contains("Le 16")').css('color','Navy');
    $('tr.M14_Calendar a.genmed:contains("Le 17")').css('color','YellowGreen');
    $('tr.M14_Calendar a.genmed:contains("Le 18")').css('color','MediumOrchid');
    $('tr.M14_Calendar a.genmed:contains("Le 19")').css('color','Peru');
    $('tr.M14_Calendar a.genmed:contains("Le 20")').css('color','LawnGreen');
    $('tr.M14_Calendar a.genmed:contains("Le 21")').css('color','black');
    $('tr.M14_Calendar a.genmed:contains("Le 22")').css('color','SandyBrown');
    $('tr.M14_Calendar a.genmed:contains("Le 23")').css('color','Indigo');
    $('tr.M14_Calendar a.genmed:contains("Le 24")').css('color','MediumAquaMarine');
    $('tr.M14_Calendar a.genmed:contains("Le 25")').css('color','darkorange');
    $('tr.M14_Calendar a.genmed:contains("Le 26")').css('color','darkgreen');
    $('tr.M14_Calendar a.genmed:contains("Le 27")').css('color','Chocolate');
    $('tr.M14_Calendar a.genmed:contains("Le 28")').css('color','DarkViolet');
    $('tr.M14_Calendar a.genmed:contains("Le 29")').css('color','DarkSlateGray');
    $('tr.M14_Calendar a.genmed:contains("Le 30")').css('color','DimGray');
    $('tr.M14_Calendar a.genmed:contains("Le 31")').css('color','Coral');
   
   
    });

Malgré tout, les événements du calendrier restent désesperément et uniformément bleues

Que puis je vous communiquer d’autre pour vous aider à m'aider ^^ ?

Un grand merci d'avance

[Neptunia]

Bonjour ^^


Il n'y a aucun javascript actif sur votre forum.
Assurez-vous de bien avoir activé le javascript :
Gestion des codes Javascript

Par ailleurs le forum étant totalement masqué aux invités, le calendrier ne montre aucun événement. Merci de fournir une capture écran d'une page de calendrier montrant au minimum 1 événement.

[xderass]

Je vous remercie pour votre réponse rapide.

Il y a pourtant bien des javascripts actifs : voir fichier joint

Et j'ajoute aussi dans les fichiers une impression d'écran pour le calendrier.

Merci encore

Fichiers joints

calendrier.jpg Vous n'avez pas la permission de télécharger les fichiers joints.(68 Ko) Téléchargé 2 fois

Javascript.jpg Vous n'avez pas la permission de télécharger les fichiers joints.(98 Ko) Téléchargé 2 fois

[xderass]

Je constate effectivement que mes javascripts ne fonctionnent plus...
Est-ce que l'activation des widgets peut en être la cause. Ne peuvent ils cohabiter ?

Merci encore

[Neptunia]

Les widgets ne sont évidemment pas incompatibles avec le javascript. Vous pouvez toutefois les désactiver provisoirement pour voir si cela débloque le fonctionnement des scripts.
Les templates ne semblent pas non plus en cause.

La seule piste qui me reste est que les javascripts ne soient pas placés correctement.
N'ayant accès ni à l'index, ni à un sous-forum ni à un sujet je ne peux voir que les javascripts pour lesquels "Sur toutes les pages" a été coché et je ne trouve rien.

[xderass]

C'est inquiétant car ils sont tous cochés "sur toutes les pages".
Je peux vous donner accès au forum sans souci, comment dois-je procéder ?

[xderass]

Tous les scritps sont cochés "Sur toutes les pages"

Un script pour des alertes :

Code:

function realTime_alert() {
    var version="phpbb3";
    var topicAlertId="13";
    jQuery.ajax({
            url: "/t"+topicAlertId+"-?view=newest",
            success: function(result) {
                var html = jQuery(result);
   
             
                if (version=="phpbb3") {
                  var alertBody= html.find("div.post .content .codebox code").eq(-1).text();
                  var id = html.find("div.post").eq(-1).attr("id");
                }
             
                if (version=="phpbb2") {
                  var alertBody= html.find("tr.post .postbody .codebox .cont_code").eq(-1).text();
                  var id = html.find("tr.post").eq(-1).attr("id");
                }
             
                if (version=="punbb") {
                  var alertBody= html.find("div.post .postbody .entry-content .codebox .cont_code code").eq(-1).text();
                  var id = html.find("div.post .postmain .posthead").eq(-1).attr("id");
                }
             
                if (version=="invision") {
                  var alertBody= html.find("div.post .post-entry .codebox.contcode dd code").eq(-1).text();
                  var id = html.find("div.post").eq(-1).attr("id");
                }
             
                if(localStorage.getItem(id)!='read' && sessionStorage.getItem(id)!=location.pathname) {
                      $('body').append(alertBody);
                      $('.realTime_alert .close').click(function() {
                        $(this).closest('.realTime_alert').fadeOut();
                        localStorage.setItem(id,"read");
                      });
                }
              if(sessionStorage.getItem(id)!=location.pathname) {
                  sessionStorage.setItem(id, location.pathname);
              } else {
                  sessionStorage.setItem(id, location.pathname);
              }
            },
    });
    return topicAlertId;
    }
   
    $(function(){
    if($("#logout").length) {
      realTime_alert();
      setInterval('realTime_alert();', 30000); // Reactualisation toutes les 30s
    }
    });

Couleurs des catégories et forums (pas sûr qu'il fonctionne mais le supprimer ne change rien)

Code:

$(function(){
              $("span.cat1").parents('.forabg, .topic-actions').attr('id','cat1');
              $("span.cat2").parents('.forabg, .topic-actions').attr('id','cat2');
    });


Palette de couleurs

Code:

$(function() {
      $('#text_editor_textarea').length && $.getScript("http://aska.123.st/17313.js")
    });


Pour la barre de navigation :

Code:


(function() {
      if (!window.FA) window.FA = {};
      if (FA.Nav) {
        if (window.console && console.warn) console.warn('FA.Nav has already been defined');
        return;
      }
   
      FA.Nav = {
       
        // TARGET NODES POUR CHAQUE VERSION
        // PHPBB2  : ".bodyline > table + table"
        // PHPBB3  : "#page-header .navlinks"
        // PUNBB    : "#pun-navlinks"
        // INVISION : "#submenu"
        targetNode : "#page-header .navlinks",
       
        customNav : '', // custom navlinks
       
        keepDefault : true, // keep the default navlinks
        collapsible : true, // show hide button
       
       
        // offset states
        offsets : {
          tbVisible : {
            bottom : 30,
            top : '30px'
          },
         
          tbHidden : {
            bottom : 0,
            top : '0px'
          },
         
          toggler : '30px'
        },
       
        activeOffset : {}, // active offset for the sticky nav
       
        visible : false, // sticky nav is visible
       
        // check the state of the static nav
        checkState : function() {
          if (!FA.Nav.animating) {
            var hidden = FA.Nav.barStatic.getBoundingClientRect().bottom <= FA.Nav.activeOffset.bottom;
         
            if (hidden && FA.Nav.barSticky.style.top != FA.Nav.activeOffset.top) {
              if (FA.Nav.toggler) FA.Nav.toggler.style.top = FA.Nav.offsets.toggler;
              FA.Nav.barSticky.style.top = FA.Nav.activeOffset.top;
              FA.Nav.visible = true;
            } else if (!hidden && FA.Nav.barSticky.style.top != '-30px') {
              if (FA.Nav.toggler) FA.Nav.toggler.style.top = '-30px';
              FA.Nav.barSticky.style.top = '-30px';
              FA.Nav.visible = false;
            }
          }
        },
       
        animating : false, // sticky nav is animating
       
        // animate the sticky nav when the toolbar is toggled
        animate : function() {
          if (FA.Nav.visible) {
            FA.Nav.animating = true;
            FA.Nav.barSticky.style.transition = 'none';
         
            $(FA.Nav.barSticky).animate({
              top : FA.Nav.activeOffset.top
            }, function() {
              FA.Nav.barSticky.style.transition = '';
              FA.Nav.animating = false;
              FA.Nav.checkState();
            });
          }
        },
       
        // toggle sticky navigation and remember preference via cookies
        toggle : function() {
          if (FA.Nav.barSticky.style.width == '100%') {
            my_setcookie('fa_sticky_nav', 'hidden');
            FA.Nav.barSticky.style.width = '0%';
          } else {
            my_setcookie('fa_sticky_nav', 'shown');
            FA.Nav.barSticky.style.width = '100%';
          }
          return false;
        }
       
      };
     
      $(function() {
        // set default offsets based on toolbar state
        FA.Nav.activeOffset = (my_getcookie('toolbar_state') == 'fa_hide' || !_userdata.activate_toolbar) ? FA.Nav.offsets.tbHidden : FA.Nav.offsets.tbVisible;
        if (!_userdata.activate_toolbar) FA.Nav.offsets.toggler = '0px';
       
        // find the static nav
        FA.Nav.barStatic = document.querySelector ? document.querySelector(FA.Nav.targetNode) : $(FA.Nav.targetNode)[0]; // static nav
       
        if (FA.Nav.barStatic) {
          $(function() {
            FA.Nav.barSticky = FA.Nav.barStatic.cloneNode(FA.Nav.keepDefault); // clone static nav
            if (FA.Nav.customNav) FA.Nav.barSticky.insertAdjacentHTML('beforeEnd', FA.Nav.customNav);
            FA.Nav.barSticky.id = 'fa_sticky_nav';
            FA.Nav.barSticky.style.width = my_getcookie('fa_sticky_nav') == 'hidden' ? '0%' : '100%';
            FA.Nav.barSticky.style.top = '-30px';
             
            document.body.appendChild(FA.Nav.barSticky); // append the sticky one
             
            // sticky nav toggler
            if (FA.Nav.collapsible) {
              FA.Nav.toggler = document.createElement('A');
              FA.Nav.toggler.id = 'fa_sticky_toggle';
              FA.Nav.toggler.href = '#';
              FA.Nav.toggler.style.top = '-30px';
              FA.Nav.toggler.onclick = FA.Nav.toggle;
             
              document.body.appendChild(FA.Nav.toggler);
            };
           
            window.onscroll = FA.Nav.checkState; // check state on scroll
            FA.Nav.checkState(); // startup check
             
            // animate sticky nav and change offsets when the toolbar is toggled
            $('#fa_hide').click(function() {
              FA.Nav.activeOffset = FA.Nav.offsets.tbHidden;
              FA.Nav.animate();
            });
           
            $('#fa_show').click(function() {
              FA.Nav.activeOffset = FA.Nav.offsets.tbVisible;
              FA.Nav.animate();
            });
          });
        }
      });
    }());

Et pour la Tchatbox

Code:

jQuery(document).ready(function () {
        jQuery('body').append('<table style="position: fixed; bottom: 250px; right: 0px;background-color: #ffffff;z-index:10000;"><tr><td><div id="panneau" scrolling="no" style="width: 800px; height: 400px; display: none;" marginwidth="0" marginheight="0" frameborder="0"><iframe src="/chatbox/index.forum?page=front" style="width: 800px; height: 400px;" ></iframe></div></td><td style="vertical-align: bottom;"><img src="http://i81.servimg.com/u/f81/11/21/85/73/ouvrir10.png" onClick="document.getElementById(\'panneau\').style.display=(this.src==\'http://i81.servimg.com/u/f81/11/21/85/73/ouvrir10.png\')?\'block\':\'none\';this.src=(this.src==\'http://i81.servimg.com/u/f81/11/21/85/73/ouvrir10.png\')?\'http://i81.servimg.com/u/f81/11/21/85/73/fermer10.png\':\'http://i81.servimg.com/u/f81/11/21/85/73/ouvrir10.png\';"/></td></tr></table>');
    });

Les 3 codes les plus importants fonctionnaient très bien avant (chatbox, menu dynamique et alertes)
Plus rien depuis l'ajout du nouveau script

[xderass]

J'ai testé et en supprimant ce script, tous les autres scripts refonctionnent... c'est curieux.

Donc mon problème concerne le script permettant de mettre des couleurs sur base du contenu de l'événement à savoir ce code :

Code:



if(location.pathname == '/calendar')
$(function(){
$('tr[valign="top"]').addClass('M14_Calendar');
$('tr.M14_Calendar a.genmed:contains("Arène cata Alpha")').css('color','blue');
$('tr.M14_Calendar a.genmed:contains("Quête d'alliance")').css('color','green');
$('tr.M14_Calendar a.genmed:contains("Le 3")').css('color','maroon');
$('tr.M14_Calendar a.genmed:contains("Event obligatoire")').css('color','fuchsia');
$('tr.M14_Calendar a.genmed:contains("Le 5")').css('color','yellow');
$('tr.M14_Calendar a.genmed:contains("Le 6")').css('color','pink');
$('tr.M14_Calendar a.genmed:contains("Le 7")').css('color','purple');
$('tr.M14_Calendar a.genmed:contains("Arène cata 4*")').css('color','orange');
$('tr.M14_Calendar a.genmed:contains("Le 9")').css('color','LightCoral');
$('tr.M14_Calendar a.genmed:contains("Le 10")').css('color','OliveDrab');
$('tr.M14_Calendar a.genmed:contains("Le 11")').css('color','RosyBrown');
$('tr.M14_Calendar a.genmed:contains("Le 12")').css('color','VioletRed');
$('tr.M14_Calendar a.genmed:contains("Le 13")').css('color','SaddleBrown');
$('tr.M14_Calendar a.genmed:contains("Le 14")').css('color','Teal');
$('tr.M14_Calendar a.genmed:contains("Le 15")').css('color','SeaGreen');
$('tr.M14_Calendar a.genmed:contains("Le 16")').css('color','Navy');
$('tr.M14_Calendar a.genmed:contains("Le 17")').css('color','YellowGreen');
$('tr.M14_Calendar a.genmed:contains("Le 18")').css('color','MediumOrchid');
$('tr.M14_Calendar a.genmed:contains("Le 19")').css('color','Peru');
$('tr.M14_Calendar a.genmed:contains("Le 20")').css('color','LawnGreen');
$('tr.M14_Calendar a.genmed:contains("Le 21")').css('color','black');
$('tr.M14_Calendar a.genmed:contains("Le 22")').css('color','SandyBrown');
$('tr.M14_Calendar a.genmed:contains("Le 23")').css('color','Indigo');
$('tr.M14_Calendar a.genmed:contains("Le 24")').css('color','MediumAquaMarine');
$('tr.M14_Calendar a.genmed:contains("Le 25")').css('color','darkorange');
$('tr.M14_Calendar a.genmed:contains("Le 26")').css('color','darkgreen');
$('tr.M14_Calendar a.genmed:contains("Le 27")').css('color','Chocolate');
$('tr.M14_Calendar a.genmed:contains("Le 28")').css('color','DarkViolet');
$('tr.M14_Calendar a.genmed:contains("Le 29")').css('color','DarkSlateGray');
$('tr.M14_Calendar a.genmed:contains("Le 30")').css('color','DimGray');
$('tr.M14_Calendar a.genmed:contains("Le 31")').css('color','Coral');


});


[xderass]

Up ;-)

[xderass]

Personne pour m'aider ?

[xderass]

Up ?

[Invité]

Salut xderass,

on peut aussi attribuer un id pour chaque td , c'est a dire pour chaque journée avec ce script que l'on va placer dans le template du calendrier.

Dans le template calendar_box:
Affichage/Templates/Calendrier/calendar_box


Juste avant ceci:

Code:

<div class="panel row3" id="calendar">

Déposes ceci:

Code:


<script>
    $(function(){
$( ".table1 td[colspan='1'] ").attr( "id", function(td) {
    return "M14_Cel_" +td;
  })
  });
</script>




Penses a enregistrer les modifications en cliquant respectivement sur et


A partir de là toutes les cellules se verront attribuer un id:

Première journée:

Code:

M14_Cel_0

Deuxième journée:

Code:

M14_Cel_1

etc etc

Ensuite tu peux personnaliser dans ta feuille de style comme suit:

Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style

Code:


/*Premiere journée calendrier*/
#M14_Cel_0
{
border:1px solid red;
  background:white;
  color:green;
}
#M14_Cel_0 p
{
color:red;
background:white;
}
#M14_Cel_0 ul
{
color:yellow;
background:white;
}


Penses à valider les modifications en cliquant sur le bouton "Valider".


a++

[xderass]

Un grand merci pour la réponse.

Ta proposition ne me permettra pas de résoudre mon problème car la couleur est liée à l'activité mais pas au jour où elle a lieu car ceux-ci sont différents chaque semaine.

C'est pour cela que le script que tu avais proposé à l'autre personne et que je reprends dans mon premier post, ouvrant le sujet, m'intéressait fortement.
Je ne comprends pas trop pourquoi il ne veut pas fonctionner chez moi.

Merci encore.

[Invité]

Salut xderass,
essayes avec celui-ci:

Code:


$(function(){
    $('#calendar td[colspan="1"]').addClass('M14_Calendar');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','blue');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','green');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','maroon');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','fuchsia');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','yellow');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','pink');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','purple');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','orange');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','LightCoral');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','OliveDrab');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','RosyBrown');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','VioletRed');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','SaddleBrown');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','Teal');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','SeaGreen');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','Navy');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','YellowGreen');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','MediumOrchid');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','Peru');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','LawnGreen');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','black');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','SandyBrown');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','Indigo');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','MediumAquaMarine');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','darkorange');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','darkgreen');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','Chocolate');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','DarkViolet');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','DarkSlateGray');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','DimGray');
    $('.M14_Calendar a.genmed:contains("Le texte")').css('color','Coral');
   
   
    });




a++

[xderass]

Merci beaucoup pour ton aide. Malheureusement cela ne fonctionne toujours pas
C'est à n'y rien comprendre.

J'ai adapté "Le texte" et il est basé sur le sujet du post correspondant à l'événement du calendrier
Vu que c'est 'contains' j'ai mis un seul mot (unique par rapport aux autres), pas la phrase exacte.

Les options du CSS sont sur :

Forcer le CSS de base du forum: Non
Désactiver le CSS de base : Non
Optimiser votre CSS : Oui

J'oublie quelque chose ? C'est dû au paramétrage ?
C'est compatible avec mon forum phpBB3 ?

[Invité]

Salut xderass,
il faut supprimer l'autre script dans le template .
Oui il est compatible phpbb3 .

a++

[xderass]

Salut Milouze

J'avais effectivement pas pensé à supprimer le script dans le template du calendar_box mais cela n'a rien changé (et j'ai bien sauvé et publié )
Par contre, pour être sûr. Le dernier code que tu m'as transmis, il est a mettre dans la feuille de style, c'est bien ça.

Voilà ce qui s'y trouve :

Code:

    /* sticky nav main */
    #fa_sticky_nav {
      font-size:0; /* hide whitespace */
      text-align:center;
      background:#FAFAFA;
      border-bottom:1px solid #CCC !important;
      height:30px;
      position:fixed;
      right:0;
      z-index:999;
      overflow:hidden;
      transition:top 200ms linear, width 600ms ease-in-out;
    }
   
    #fa_sticky_nav li { display:inline } /* navlist adjustment */
   
   
    /* sticky menu links */
    #fa_sticky_nav a.mainmenu {
      color:#39C;
      font-size:12px;
      font-weight:bold;
      font-family:"Trebuchet MS", Arial, Verdana, Sans-serif;
      background:url('http://i18.servimg.com/u/f18/18/45/41/65/nav10.png') repeat-x 0px 30px;
      display:inline-block;
      padding:0 10px;
      height:30px;
      line-height:30px;
      transition:200ms;
    }
   
    #fa_sticky_nav a.mainmenu:hover, #fa_sticky_nav a.mainmenu.fa_navactif {
      background-position:0 25px;
    }
   
   
    /* sticky nav toggler */
    #fa_sticky_toggle {
      background:url('http://i21.servimg.com/u/f21/18/21/41/30/omnibo10.png') no-repeat 0 0 #FAFAFA;
      border:1px solid #CCC;
      border-right:none;
      display:inline-block;
      height:29px;
      width:30px;
      position:fixed;
      right:0;
      z-index:999;
      transition:top 200ms linear;
    }
   
    #fa_sticky_toggle:hover { background-position:-30px 0 }
   
   
    /* make hidden toolbar similar to toggler */
    #fa_toolbar_hidden {
      border-radius:0 !important;
      border:1px solid #CCC;
      border-right:0;
      border-top:0;
    }
   
   
    /* post offset fix */
    .post div[style*="-30px;"] {
      top:-60px !important;
    }

    .realTime_alert{
    background:#FDFDFD no-repeat 10px center;
    -webkit-background-size:50px;
      -moz-background-size:50px;
        -o-background-size:50px;
            background-size:50px;
    -webkit-box-shadow:0 0 4px rgba(0,0,0,.6);
      -moz-box-shadow:0 0 4px rgba(0,0,0,.6);
            box-shadow:0 0 4px rgba(0,0,0,.6);
    position:fixed;
    top:50px;
    right:20px;
    min-height:60px;
    font-size:13px;
    width:200px;
    padding:10px 10px 10px 70px;
    font-family:Helvetica;
    color:#474747;
    }
    .realTime_alert b{
    display:block;
    margin-bottom:5px;
    font-size:15px;
    }
    .realTime_alert .close{
    position:absolute;
    right:10px;
    top:5px;
    font-size:15px;
    -webkit-border-radius:50px;
      -moz-border-radius:50px;
            border-radius:50px;
    height:16px;
    width:16px;
    text-align:center;
    line-height:13px;
    cursor:pointer;
    }
    .realTime_alert .close:hover{
    color:#FFF;
    background:#666;
    }
    #ebtzd .tooltip{
    opacity:0;
    position:relative;
    overflow:visible;
    z-index:100!important;
    display:inline-block;
    top:5px;
    -webkit-transition-duration:500ms;
      -moz-transition-duration:500ms;
        -o-transition-duration:500ms;
            transition-duration:500ms;
    background:rgba(0, 0, 0, .8);
    padding:10px;
    -webkit-border-radius:3px;
      -moz-border-radius:3px;
            border-radius:3px;
    font-family:Helvetica;
    letter-spacing:1px;
    font-size:13px;
    width:300px;
    color:#fff;
    }




    #widget-arrows {
      height: 13px;
    }
    .widget-arrow {
      height: 13px;
      width: 16px;
      border-radius: 4px;
      float: left;
      cursor: pointer;
      background: #f5ebf7 url(http://i.imgur.com/zVQMs.png) no-repeat 0 -13px;
    }
    .widget-arrow.isright {
      float: right;
    }
    .widget-arrow.isleft.isclosed, .widget-arrow.isright.isopened {
      background-position: 0 0;
    }




table.table1 tbody th {
background-color: lightblue !important;
color: black !important;
}



/* Les arrondis dans le calendrier */

            .genmed {
              -moz-border-radius: 40px;
              -webkit-border-radius: 40px;
              border-radius: 40px;}

    th {
                -moz-border-radius: 40px;
              -webkit-border-radius: 40px;
              border-radius: 40px;}


 
   
    $(function(){
        $('#calendar td[colspan="1"]').addClass('M14_Calendar');
        $('.M14_Calendar a.genmed:contains("duels")').css('color','blue');
        $('.M14_Calendar a.genmed:contains("terme")').css('color','green');
        $('.M14_Calendar a.genmed:contains("cata")').css('color','fuchsia');
        $('.M14_Calendar a.genmed:contains("QA")').css('color','yellow');
   
     
        }
   

Je vais devoir finir par abandonner on dirait
Je ne comprends pas pourquoi ça a fonctionné sur un autre forum et que ça ne va pas dur le mien

Fichiers joints

calendrier pas ok.jpg Vous n'avez pas la permission de télécharger les fichiers joints.(130 Ko) Téléchargé 0 fois

[mariok13]

bonjour

regarde de ce coté vu que je suis trés nul milouze à essayé de comprendre ce que je voulais et on est arrivé à une solution

https://forum.forumactif.com/t378943-couleur-differentes-dans-le-calendrier?highlight=calendrier

[xderass]

Bonjour Mariok13.

Je ne suis pas expert non plus mais pour moi c'est prévisément le même code, légèrement modifié, que j'essaye d'implémenter dans mon forum mais sans résultat (et je ne comprends pas pourquoi )
C'est d'ailleurs à partir de ton sujet que j'ai fait ma première tentative et comme infructueuse, j'ai ouvert ce sujet.

Je suppose que ça fonctionne bien pour toi et c'est donc très frustrant de ne pas le voir fonctionner sur mon forum . Tout reste désespérément unicolore bleu...

[mariok13]

bon cela ne colorise pas le carré mais le le texte seulement

voila comment cela marche

Code:

 $('.M14_Calendar a.genmed:contains("Le texte")').css('color','blue');

il te faut indiquer un nom a la place de "le texte" remplace texte par ce que tu veux

puis ce nom doit etre en premier dans le titre de ton sujet

exemples

Code:

$('.M14_Calendar a.genmed:contains("Adhérentes")').css('color','blue');

voici le titre du sujet

Adhérentes Réunion de formation

pour exemple mon code

Code:

 if(location.pathname == '/calendar')
$(function(){
$('tr[valign="top"]').addClass('M14_Calendar');
$('tr.M14_Calendar a.genmed:contains("Responsables")').css('color','green');
$('tr.M14_Calendar a.genmed:contains("[Impôt]")').css('color','maroon');
$('tr.M14_Calendar a.genmed:contains("Le 4")').css('color','fuchsia');
$('tr.M14_Calendar a.genmed:contains("Le 5")').css('color','yellow');
$('tr.M14_Calendar a.genmed:contains("Le 6")').css('color','pink');
$('tr.M14_Calendar a.genmed:contains("Le 7")').css('color','purple');
$('tr.M14_Calendar a.genmed:contains("Le 8")').css('color','orange');
$('tr.M14_Calendar a.genmed:contains("Le 9")').css('color','LightCoral');
$('tr.M14_Calendar a.genmed:contains("Le 10")').css('color','OliveDrab');
$('tr.M14_Calendar a.genmed:contains("Le 11")').css('color','RosyBrown');
$('tr.M14_Calendar a.genmed:contains("Bureau")').css('color','Red');
$('tr.M14_Calendar a.genmed:contains("Le 13")').css('color','SaddleBrown');
$('tr.M14_Calendar a.genmed:contains("Le 14")').css('color','Teal');
$('tr.M14_Calendar a.genmed:contains("Le 15")').css('color','SeaGreen');
$('tr.M14_Calendar a.genmed:contains("Le 16")').css('color','Navy');
$('tr.M14_Calendar a.genmed:contains("Le 17")').css('color','YellowGreen');
$('tr.M14_Calendar a.genmed:contains("Le 18")').css('color','MediumOrchid');
$('tr.M14_Calendar a.genmed:contains("Le 19")').css('color','Peru');
$('tr.M14_Calendar a.genmed:contains("Adhérentes")').css('color','orange');
$('tr.M14_Calendar a.genmed:contains("Le 21")').css('color','black');
$('tr.M14_Calendar a.genmed:contains("Le 22")').css('color','SandyBrown');
$('tr.M14_Calendar a.genmed:contains("Le 23")').css('color','Indigo');
$('tr.M14_Calendar a.genmed:contains("Le 24")').css('color','MediumAquaMarine');
$('tr.M14_Calendar a.genmed:contains("Le 25")').css('color','darkorange');
$('tr.M14_Calendar a.genmed:contains("Le 26")').css('color','darkgreen');
$('tr.M14_Calendar a.genmed:contains("Le 27")').css('color','Chocolate');
$('tr.M14_Calendar a.genmed:contains("Assmat")').css('color','MediumOrchid');
$('tr.M14_Calendar a.genmed:contains("Le 29")').css('color','DarkSlateGray');
$('tr.M14_Calendar a.genmed:contains("Le 30")').css('color','DimGray');
$('tr.M14_Calendar a.genmed:contains("Le 31")').css('color','Coral');
 
 
});

et surtout un grand merci à @milouze14

[xderass]

Merci mariok.

C'est effectivement ce que j'ai fait. J'ai modifié le texte et je l'ai remplacé par ce que contient mes sujets dans les événements calendrier, sans changement de couleur de ceux-ci dans le calendrier. Le texte reste en bleu (on est bien d'accord que le fond ne bouge pas ;-)

Donc il doit y avoir quelque chose qui bloque mais je ne vois pas quoi. C'est pour cela que j'ai mis tout mon CSS. Peut-être que milouze14 arrivera à comprendre... sinon je serai à cours de possibilité :s

Et encore mille mercis à lui effectivement pour tous ses efforts, propositions et sa gentillesse.

[Invité]

Salut xderass,

hum je vois tu as déposé le script dans ta feuille de style .

supprimes ceci de ta feuille de style:

Code:


   
        $(function(){
            $('#calendar td[colspan="1"]').addClass('M14_Calendar');
            $('.M14_Calendar a.genmed:contains("duels")').css('color','blue');
            $('.M14_Calendar a.genmed:contains("terme")').css('color','green');
            $('.M14_Calendar a.genmed:contains("cata")').css('color','fuchsia');
            $('.M14_Calendar a.genmed:contains("QA")').css('color','yellow');
       
         
            }
       



Modules/HTML&JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript

Mettre un titre explicite.

Cocher sur toutes les pages.

Déposes ceci:

Code:


   
        $(function(){
            $('#calendar td[colspan="1"]').addClass('M14_Calendar');
            $('.M14_Calendar a.genmed:contains("duels")').css('color','blue');
            $('.M14_Calendar a.genmed:contains("terme")').css('color','green');
            $('.M14_Calendar a.genmed:contains("cata")').css('color','fuchsia');
            $('.M14_Calendar a.genmed:contains("QA")').css('color','yellow');
       
         
});
       



Penses à cliquer sur le bouton

Et voilà le tour est joué .

a++

[xderass]

Salut Milouze.



MERCI !!!!

ça fonctionne

Désolé, je pensais que comme c'était visuel c'était à mettre dans la feuille de style. Je suis un boulet.

Comme l'a déjà dit mariok, t'es le meilleur :-)