테스트 사이트 - 개발 중인 베타 버전입니다

시간 카운트다운 자바 스크립트 질문 드립니다

헤로 10년 전 조회 7,690

 

 

시간 카운트다운 자바 스크립트에서 남은 시간이 00시 00분 00초가 되었을때

 

시간 숫자 부분을 없애고 '남은 시간이 없습니다' 메시지를 나타나게 하려면 어떻게 해야할까요??

 

소스 1에 주황색으로 표시된 부분을 소스 2에 맞게 변형하여 적용하고 싶습니다

 

 

 

 

 

소스1

 

////php코드 시작///

 

$adate2[0] :  데이타 베이스의 timestamp형식으로 되어있는 값을 가지고 옵니다. 

    $date1=mktime($adate2[0],0,0,$adate[0],$adate[1],$adate1[0]); //end타임의 timestamp값 

    $date2=mktime(); 

     

    $total_secs=abs($date1 - $date2); 

    $diff_in_days = floor($total_secs / 86400); 

    $rest_hours = $total_secs % 86400; 

    $diff_in_hours = floor($rest_hours / 3600); 

    $rest_mins = $rest_hours % 3600; 

    $diff_in_mins = floor($rest_mins / 60); 

    $diff_in_secs = floor($rest_mins % 60); 

    $time_diff = $diff_in_days ."일". $diff_in_hours ."시간".     $diff_in_mins ."분". $diff_in_secs ."초"; 

 

//// php코드 끝 //////

 

// 자바스크립트 코드 

 

 

// body 부분 아래와 적어준다. 

 

 

////스크립트 종료 /////

 

 

 

 

 

 

소스2

 

위에 주황색 부분으로 표시된 내용을 아래의 소스에 맞게 변형을 어떻게 해야하는지 꼭 알고싶습니다 부탁드려요

 

 

(function($){

 

 

 

  config = {};

 

  $.extend(config, options);

 

  diffSecs = this.setCountDown(config);

 

  if (config.onComplete)

  {

   $.data($(this)[0], 'callback', config.onComplete);

  }

  if (config.omitWeeks)

  {

   $.data($(this)[0], 'omitWeeks', config.omitWeeks);

  }

 

  $('#' + $(this).attr('id') + ' .digit').html('

');

  $(this).doCountDown($(this).attr('id'), diffSecs, 500);

 

  return this;

 

 };

 

 $.fn.stopCountDown = function () {

  clearTimeout($.data(this[0], 'timer'));

 };

 

 $.fn.startCountDown = function () {

  this.doCountDown($(this).attr('id'),$.data(this[0], 'diffSecs'), 500);

 };

 

 $.fn.setCountDown = function (options) {

  var targetTime = new Date();

 

  if (options.targetDate)

  {

   targetTime = new Date(options.targetDate.month + '/' + options.targetDate.day + '/' + options.targetDate.year + ' ' + options.targetDate.hour + ':' + options.targetDate.min + ':' + options.targetDate.sec + (options.targetDate.utc ? ' UTC' : ''));

  }

  else if (options.targetOffset)

  {

   targetTime.setFullYear(options.targetOffset.year + targetTime.getFullYear());

   targetTime.setMonth(options.targetOffset.month + targetTime.getMonth());

   targetTime.setDate(options.targetOffset.day + targetTime.getDate());

   targetTime.setHours(options.targetOffset.hour + targetTime.getHours());

   targetTime.setMinutes(options.targetOffset.min + targetTime.getMinutes());

   targetTime.setSeconds(options.targetOffset.sec + targetTime.getSeconds());

  }

 

  var nowTime = new Date();

 

  diffSecs = Math.floor((targetTime.valueOf()-nowTime.valueOf())/1000);

 

  $.data(this[0], 'diffSecs', diffSecs);

 

  return diffSecs;

 };

 

 $.fn.doCountDown = function (id, diffSecs, duration) {

  $this = $('#' + id);

  if (diffSecs <= 0)

  {

   diffSecs = 0;

   if ($.data($this[0], 'timer'))

   {

    clearTimeout($.data($this[0], 'timer'));

   }

  }

 

  secs = diffSecs % 60;

  mins = Math.floor(diffSecs/60)%60;

  hours = Math.floor(diffSecs/60/60)%24;

  if ($.data($this[0], 'omitWeeks') == true)

  {

   days = Math.floor(diffSecs/60/60/24);

   weeks = Math.floor(diffSecs/60/60/24/7);

  }

  else 

  {

   days = Math.floor(diffSecs/60/60/24)%7;

   weeks = Math.floor(diffSecs/60/60/24/7);

  }

 

  $this.dashChangeTo(id, 'seconds_dash', secs, duration ? duration : 800);

  $this.dashChangeTo(id, 'minutes_dash', mins, duration ? duration : 1200);

  $this.dashChangeTo(id, 'hours_dash', hours, duration ? duration : 1200);

  $this.dashChangeTo(id, 'days_dash', days, duration ? duration : 1200);

  $this.dashChangeTo(id, 'weeks_dash', weeks, duration ? duration : 1200);

 

  $.data($this[0], 'diffSecs', diffSecs);

  if (diffSecs > 0)

  {

   e = $this;

   t = setTimeout(function() { e.doCountDown(id, diffSecs-1) } , 1000);

   $.data(e[0], 'timer', t);

  } 

  else if (cb = $.data($this[0], 'callback')) 

  {

   $.data($this[0], 'callback')();

  }

 

 };

 

 $.fn.dashChangeTo = function(id, dash, n, duration) {

    $this = $('#' + id);

   

    for (var i=($this.find('.' + dash + ' .digit').length-1); i>=0; i--)

    {

    var d = n%10;

    n = (n - d) / 10;

    $this.digitChangeTo('#' + $this.attr('id') + ' .' + dash + ' .digit:eq('+i+')', d, duration);

    }

 };

 

 $.fn.digitChangeTo = function (digit, n, duration) {

  if (!duration)

  {

   duration = 800;

  }

  if ($(digit + ' div.top').html() != n + '')

  {

 

   $(digit + ' div.top').css({'display': 'none'});

   $(digit + ' div.top').html((n ? n : '0')).slideDown(duration);

 

   $(digit + ' div.bottom').animate({'height': ''}, duration, function() {

    $(digit + ' div.bottom').html($(digit + ' div.top').html());

    $(digit + ' div.bottom').css({'display': 'block', 'height': ''});

    $(digit + ' div.top').hide().slideUp(10);

 

   

   });

  }

 };

 

})(jQuery);

 

 

 

 

댓글을 작성하려면 로그인이 필요합니다.

답변 1개

document.timer.counter.value = day + '일 ' + hour + '시간 ' + min + '분 ' + sec + '초 '; 

//1초당 한번씩 timer1()을 호출하여 실행 

window.setTimeout('Timer1()',1000);  

 

이부분을 if로 감싸면 되겠는데요

if(day == 0 && hour == 0 && ~~~~~~~~~~~~~~)

{

 

document.timer.counter.value = day + '일 ' + hour + '시간 ' + min + '분 ' + sec + '초 '; 

//1초당 한번씩 timer1()을 호출하여 실행 

window.setTimeout('Timer1()',1000);

}

else

 document.timer.counter.value = "시간종료"; 

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인