完整日历：为事件设置动画

Question

我想在更改颜色的日历中为活动设置动画。
所以

1. 我从数据库中选择我的日期警报，我比较日期（日期警报，今天）

2. 我改变颜色事件

3. 我动画事件

   eventRender: function(event, element) { 
   
   function compareDates() {
   
   var d = new Date();
   var today = d.format("yyyy-mm-dd HH:MM:ss");
   <?php 
   mysql_connect("","","");
   mysql_select_db("");
          $requete = mysql_query('SELECT * FROM evenement where id_user=1 ') ;
          while ($ligne=mysql_fetch_array($requete))
          {
           $date=$ligne['dateAlert'];
           $id=$ligne['id_event'];
   
           ?>
   
   var dateAlert = '<?php echo $date;?>';
   if(dateAlert == today){
   var id='<?php echo $id;?>';
   
   alert('alert ID rdv:'+id);
   
   var rdv=$('#calendar').fullCalendar( 'clientEvents');
   for (i=0; i<=rdv.length-1; i++) {
   
   if(rdv[i].id==id){
   rdv[i].backgroundColor='red';
   rdv[i].borderColor='red';
   
       $('#calendar').fullCalendar('renderEvent', id );
   
           }
   
   }
     //where i put this ligne?
   
    setInterval(function(){ element.fadeOut(900).delay(300).fadeIn(800);
                           },2000);
   }
   
    <?php }?>
   
   }
       myvar=setInterval(function(){compareDates()},1000);
   
   },
   

我该怎么办？

Answer 1

查看演示，希望这符合您的要求。

        var date = new Date();
        var d = date.getDate();
        var m = date.getMonth();
        var y = date.getFullYear();


        Date.prototype.formatMMDDYYYY = function(){
            return this.getMonth() + 
            "/" +  this.getDate() +
            "/" +  this.getFullYear();
        }

        var todaysDate = new Date();

        var rdv = $('#calendar').fullCalendar({
                    header: {
                        left: 'prev,next today',
                        center: 'title',
                        right: 'month,agendaWeek,agendaDay'
                    },
                    editable: true,
                    events: [
                        {
                              "title":"Hello World",
                              "start":"Wed, 08 Apr 2013 09:00:00 EST",
                              "end":"Wed, 08 Apr 2013 10:00:00 EST"
                        },
                        {
                              "title":"Good Afternoon",
                              "start":"Wed, 03 Apr 2013 13:00:00 EST",
                              "end":"Wed, 03 Apr 2013 17:00:00 EST"
                        },
                    ],
                    eventRender: function(event, element) {
                        var eventDate = new Date(event.start);
                        if(todaysDate.formatMMDDYYYY() === eventDate.formatMMDDYYYY()) {
                            setInterval(function(){
                                element.fadeOut(900).delay(300).fadeIn(800);
                            },2000);
                        }

                    }
                });

DEMO

Answer 2

setInterval(function(){
    rdv[i].fadeOut(900).delay(300).fadeIn(800);
},2200);