J'utilise mais cela n'a aucun effet sur le look du calendrier. Des idées? avant de voir et avez attribué la classe Specialday à des jours particuliers dans mon calendrier; Cela fonctionne bien, cependant, j'ai du mal à comprendre comment organiser la classe et la manière dont le CSS du rouleau de thème fonctionne en général. J'ai essayé:
7 Réponses :
Chaque fois que j'utilise la jquery ui trucs, j'utilise Firebug Pour vérifier tous les styles appliqués à des éléments particuliers, cela vous permettra d'identifier facilement les éléments CSS dont vous avez besoin pour jouer avec.
J'utilise Firebug, ithink que le style actuel est appliqué à partir du rouleau de thème par défaut CSS: .ui-State-Par défaut, contenu .UI-Widget-Contenu .UI-State-Par défaut {-MOZ-Background-fond-clip: bordure; -Moz-fond-inline-politique: continu; -Moz-fond-d'origine: rembourrage; Fond: URL # 75C8FF (images / ui-bg_glass_75_75c8ff_1x400.png) Répéter-x Scroll 50% 50%; frontière: 1px solide # 3A9ee0; couleur: # 555555; Poids de la police: normal; Couleur de contour: -Moz-user-user-text-couleur; Style de contour: Aucun; Contour de la largeur: moyenne; Ma question est alors, comment puis-je modifier les cellules avec la classe .pecialday qui a déjà ce qui précède?
J'ai eu le même problème, heureusement, j'ai trouvé la réponse. Lorsque vous désactivez une journée (défini sur "False") est valide pour affecter une classe (". Specialdate") pour modifier la couleur d'arrière-plan, mais pas si la date est activée, car nous avons une autre ancre de style ("A") que remplace la classe attribuée à "TD" ancreur.
Donc, si votre date est activée pour sélectionner et que vous souhaitez modifier les styles, vous devez modifier l'ancre "A" héritée, comme ceci: P>
.specialDate a { background: #33CC66 !important; }
C'est vraiment important la marque "! Important" après l'arrière-plan. Est-ce que quelqu'un sait pourquoi le besoin de cette substitution? Si je le supprime, ces valeurs par défaut apparaissent toujours.
.specialDate {filter:Alpha(Opacity=100)!important; opacity: 1!important}
Créez votre style CSS comme celui-ci:
$('#datepicker').datepicker('option', 'beforeShowDay', highlightDays);
// ------------------------------------------------------------------
// highlightDays
// ------------------------------------------------------------------
function highlightDays(date) {
for (var i = 0; i < dates.length; i++) {
if (SOME CONDITION TO DETERMIN SPECIAL DAY) {
return [true, 'specialDay'];
}
}
return [true, ''];
}
Voici un peu qui mettra en évidence la date actuelle ou la date de la zone de texte associée.
Le style: Le script:
Si le calendrier d'interface utilisateur a un thème, vous devez désactiver le arrière-plan-image pour l'attribut spécialDate:
Utilisation du clic Vous pouvez effectuer tout le CSS dont vous avez besoin:
var checkin = $('.dpd1').datepicker()
.on('click', function (ev) {
$('.datepicker').css("z-index", "999999999");
}).data('datepicker');