카운팅 애니메이션 문의 드립니다.

카운팅 애니메이션 문의 드립니다.

QA

카운팅 애니메이션 문의 드립니다.

본문

게시판 숫자 카운팅을 아래의 소스로 하고 있습니다.



<?php
$intime = date("Y-m-d H:i:s", time() - (int)(60 * 60 * 24));
$sql = " select count(*) as today_count from g5_write_00000 where wr_datetime >= '$intime' and wr_is_comment=0" ;
$data = sql_fetch($sql);
$new_list = $data['today_count'];
 
$list_a = sql_fetch("select count(*) as bo_count_write from g5_write_00000 where wr_is_comment=0 ");
$list_a = $list_a['bo_count_write'];
 
$comment_a = sql_fetch("select count(*) as bo_count_comment from g5_write_00000 where wr_is_comment=1 ");
$comment_a = $comment_a['bo_count_comment'];
 
echo "새글 ".$new_list."<br>"; // 새글
echo "전체 게시글 수 ".$list_a."<br>"; // 전체 게시글 수
echo "전체 코멘트 수 ".$comment_a; // 전체 코멘트 수
?>

해당 수치를 아래의 카운트 애니메이션으로 적용하려 하는데요.

 


<script>
function numberCounter(target_frame, target_number) {
    this.count = 0; this.diff = 0;
    this.target_count = parseInt(target_number);
    this.target_frame = document.getElementById(target_frame);
    this.timer = null;
    this.counter();
};
    numberCounter.prototype.counter = function() {
        var self = this;
        this.diff = this.target_count - this.count;
   
        if(this.diff > 0) {
            self.count += Math.ceil(this.diff / 5);
        }
   
        this.target_frame.innerHTML = this.count.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',');
   
        if(this.count < this.target_count) {
            this.timer = setTimeout(function() { self.counter(); }, 20);
        } else {
            clearTimeout(this.timer);
        }
    };

window.onload = function(){
new numberCounter("counter3", <?php echo $new_list; ?>);
new numberCounter("counter2", <?php echo $list_a; ?>);
new numberCounter("counter1", <?php echo $comment_a; ?>);
}
</script>

 

<p id="counter1"></p>
<p id="counter2"></p>
<p id="counter3"></p>

 

수치가 아예 표시되지 않고 그냥 "0"으로 표시 됩니다.

어디를 수정해야 할까요?

고수님들 부탁 드리겠습니다.

감사합니다.

이 질문에 댓글 쓰기 :

답변 2

테스트해봤는데 잘되는데요??


<?php
$intime = date("Y-m-d H:i:s", time() - (int)(60 * 60 * 24));
$sql = " select count(*) as today_count from g5_write_ccc where wr_datetime >= '$intime' and wr_is_comment=0" ;
$data = sql_fetch($sql);
$new_list = $data['today_count'];
 
$list_a = sql_fetch("select count(*) as bo_count_write from g5_write_ccc where wr_is_comment=0 ");
$list_a = $list_a['bo_count_write'];
 
$comment_a = sql_fetch("select count(*) as bo_count_comment from g5_write_ccc where wr_is_comment=1 ");
$comment_a = $comment_a['bo_count_comment'];
?>
<script>
function numberCounter(target_frame, target_number) {
    this.count = 0; this.diff = 0;
    this.target_count = parseInt(target_number);
    this.target_frame = document.getElementById(target_frame);
    this.timer = null;
    this.counter();
};
    numberCounter.prototype.counter = function() {
        var self = this;
        this.diff = this.target_count - this.count;
   
        if(this.diff > 0) {
            self.count += Math.ceil(this.diff / 5);
        }
   
        this.target_frame.innerHTML = this.count.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',');
   
        if(this.count < this.target_count) {
            this.timer = setTimeout(function() { self.counter(); }, 20);
        } else {
            clearTimeout(this.timer);
        }
    };
window.onload = function(){
new numberCounter("counter3", <?php echo $new_list; ?>);
new numberCounter("counter2", <?php echo $list_a; ?>);
new numberCounter("counter1", <?php echo $comment_a; ?>);
}
</script>
<p id="counter1"></p>
<p id="counter2"></p>
<p id="counter3"></p>

위에 넣은 php 변수에 값이 정상적으로 들어있는지 확인해 보세요.

new numberCounter("counter3", 10000);

이렇게 하면 정상적으로 작동합니다.

$new_list;

이 변수들이 전부 0이 아닐까 싶네요.

답글 너무 감사합니다.

$new_list."<br>"; // 새글
$list_a."<br>"; // 전체 게시글 수
$comment_a; // 전체 코멘트 수

지정된 게시판의 글 수치 입니다
애니메이션 적용전에는 잘 나오는데요.
정상적으로 출력되는 수치를 애니메이션 효과를 주고 싶어서요.

적용했더니 그냥 "0"만 출력되고 있습니다.

쟁반짜장님께서 말씀해주신 방법으로 하면
지정된 수가 애니메이션 효과로 출력됩니다.
근데 지정된 수가 아닌 게시글의 수에 대해 애니메이션으로 하고싶습니다.
방법이 없을까요?

관심가져 주셔서 다시한번 감사드립니다.

echo "새글 ".$new_list."<br>"; // 새글
echo "전체 게시글 수 ".$list_a."<br>"; // 전체 게시글 수
echo "전체 코멘트 수 ".$comment_a; // 전체 코멘트 수
여기에선 값이 정상적으로 나온다는 말씀이시잖아요.
그러면 소스 보기 했을 때
new numberCounter("counter3", 여기);
여기라고 된 부분에 값이 정상적으로 들어가 있나요?

쟁반짜장님 말씀대로 소스보기로 보니 값이 들어가있지 않네요.

echo "새글 ".$new_list."<br>"; // 새글
echo "전체 게시글 수 ".$list_a."<br>"; // 전체 게시글 수
echo "전체 코멘트 수 ".$comment_a; // 전체 코멘트 수
해당 부분에는 정상적으로 값이 들어있는데 말이죠.

어떻게 하면 될수 있을까요?
바쁘실텐데 감사합니다.

쟁반짜장님 감사합니다.
덕분에 잘 해결되었습니다.

그리고 php부분이랑 script 랑 같이 있습니다.
자바스크립트 불러오는 법을 몰라서요...죄송합니다.
시간되실때 알려주시면 적용해보겠습니다.

답답하셨을 텐데 관심가져 주셔서 감사드립니다.

답변을 작성하시기 전에 로그인 해주세요.
전체 2

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT