0

我无法让翻转时钟在多个实例上工作。我尝试归因于不同的 ID，但这并不重要。

<div class="captainmarvel2" style="width: 30%">
 <img src="Pictures/captainlogo.png">
 <h5>In Theaters 8 March 2019</h5>
 <div class="clock" id ="clock4"></div>
 <a href="https://www.myvue.com/film/captain-marvel" target="_blank" id="myButton3Hide" disabled>Buy Ticket on Vue</a>
</div>

<div class="endgame2" style="width: 30%">
 <img src="Pictures/endgame.png">
 <h5>In Theaters 8 March 2019</h5>
 <div class="clock" id ="clock5"></div>
 <a href="https://www.myvue.com/film/avengers-endgame" target="_blank" id="myButton5Hide" disabled>Buy Ticket on Vue</a>
</div>

/* Countdown until Captain Marvel Release */

var next_show = new Date('2019-04-11T21:46:00');
var diff = next_show.getTime() - new Date().getTime();

var showtime = Math.floor(diff / 1000);
var clock = $('#clock4').FlipClock({
  clockFace: 'DailyCounter',
  countdown: true
});

setTimeout(function(){ 
  checktime();
}, 1000);

function checktime(){
  t = clock.getTime();
  if(t<=0){
    $('#myButton4hide').removeAttr('disabled');
    $('#clock4').remove();
  }
  setTimeout(function(){ 
    checktime();
  }, 1000);
}
clock.setTime(showtime);
clock.start();

/* Countdown until Endgame Release */

var next_show = new Date('2019-05-10T22:24:00');
var diff = next_show.getTime() - new Date().getTime();

var showtime = Math.floor(diff / 1000);
var clock = $('#clock5').FlipClock({
  clockFace: 'DailyCounter',
  countdown: true
});

setTimeout(function(){ 
  checktime();
}, 1000);

function checktime(){
  t = clock.getTime();
  if(t<=0){
    $('#myButton5hide').removeAttr('disabled');
    $('#clock5').remove();
  }
  setTimeout(function(){ 
    checktime();
  }, 1000);
}
clock.setTime(showtime);
clock.start();

所以，我想要三个这样的时钟并排放置。上面我已经包括了两个我一直在尝试的时钟，因为在我得到两个工作之前我还没有尝试过第三个。

4

0 回答 0