联系电话:020-28187900

投票和抢楼的倒计时功能

发表时间:2012-09-26 阅读: 1885

需要的jquery.timer.js已经在/js/中提供了,只要稍作修改就可以实现了,KingCMS地方门户 V2.2的 投票和抢楼的倒计时功能效果如下图:


  • JS方面

1、在HTML的head中引入jquery.timer.js,如下所示

<script type="text/javascript" charset="UTF-8" src="<?=DIR?>js/jquery.timer.js"></script>
2、增加一个包装函数,可以放在head.或</body>前面。以下是读秒的封装

<script type="text/javascript">
        function maketimer(ele){
                return $.timer(function(){
                        var currentEle=$('#'+ele);
                        var et=parseInt(currentEle.html());
                        if(et==0){this.stop();}else{et-=1;}
                        if(et==0){
                                var tol=currentEle.attr('rel');
                                if(parseInt(tol)>60){
                                        currentEle.attr('rel',tol-60);
                                        et=60;
                                }else if(parseInt(tol)>0){
                                        currentEle.attr('rel','0')
                                        et=tol;
                                }else{
                                        this.stop();
                                        $('#'+ele+'_action').removeClass('on').addClass('finish').html('');
                                }
                        }
                        currentEle.html(et);
                },1000,true);
        }
</script>
  • 如果要读小时,或分钟要改几个地方。

以下是秒数显示在dt中,在这块区域:

<div class="lcbox"><dl><dt></dt></dl>
详细代码

<?php if($pl['m']>0):?><script type="text/javascript">maketimer("poll_<?=$pl['vid']?>");</script> <?php endif;?>
说明:$pl['m']中存放是当前时间到结束时间所剩的秒数.该示例以60秒一个区段.也就是说<dt>中显示的数字在1-60之间.如果到0重新从60开始.一秒过后-1

  • 注册timer

<?php if($pl['m']>0):?><script type="text/javascript">maketimer("poll_<?=$pl['vid']?>");</script> <?php endif;?>
完整示例,只标示了修改的部分,不变的省略掉了

<div class="body-box">
        <?php foreach($polls as $pl):?>
                <div class="cbox">
                        <div class="lcbox">
                                <dl><dt id="poll_<?=$pl['vid']?>" rel="<?=($pl['m']>60)?($pl['m']-60):0?>"><?=($pl['m']>60)?60:$pl['m']?></dt>
                                        <dd id="poll_<?=$pl['vid']?>_action" class="<?=($pl['m']>0)?'on':'finish'?>">...</dd>
                                </dl>
                        </div>
                        <div class="rcbox">...</div>
                </div>
                <?php if($pl['m']>0):?><script type="text/javascript">maketimer("poll_<?=$pl['vid']?>");</script> <?php endif;?>
        <?php endforeach;?>
</div>

文章出自kcest.com


相关教程 【更多】

唯众网络