轮播图页面的倒计时
轮播图页面的倒计时
开源中国社区-紫薯 发表于2年前
轮播图页面的倒计时
  • 发表于 2年前
  • 阅读 31
  • 收藏 0
  • 点赞 1
  • 评论 3

腾讯云 技术升级10大核心产品年终让利>>>   

摘要: 轮播图倒计时

轮播图倒计时功能:(倒计时可轮播)

倒计时的显示代码需要放到显示图片和超链接之间

 <div class="downCount">
                           <div class="countdown-area">
                           <div class="csslb">
                           <div class="countdown-title">距离此活动开始还有</div>
                           <div class="countdown-dividingline"></div>
                                    <div id="countdown" class="countdown-time clearfix">
                                        <span class="day">-</span><span>天</span>
                                        <span class="hour">-</span><span>时</span>
                                        <span class="minute">-</span><span>分</span>
                                        <span class="second">-</span><span>秒</span>
                                    </div>
                                 </div>   
                                </div>
                           </div>
<script type="text/javascript">
                           $(function(){
                           //此处传入倒计时时间日期/此处需要格式化时间为yyyy/MM/dd HH:mm:ss
                                countDown("${fns:format(时间,'yyyy/MM/dd HH:mm:ss')}","#countdown .day","#countdown .hour","#countdown .minute","#countdown .second");
                            });

                            function countDown(time,day_elem,hour_elem,minute_elem,second_elem){
                                //if(typeof end_time == "string")
                                var end_time = new Date(time).getTime(),//月份是实际月份-1
                                //current_time = new Date().getTime(),
                                sys_second = (end_time-new Date().getTime())/1000;
                                var timer = setInterval(function(){
                                    if (sys_second > 0) {
                                        sys_second -= 1;
                                        var day = Math.floor((sys_second / 3600) / 24);
                                        var hour = Math.floor((sys_second / 3600) % 24);
                                        var minute = Math.floor((sys_second / 60) % 60);
                                        var second = Math.floor(sys_second % 60);
                                        day_elem && $(day_elem).text(day);//计算天
                                        $(hour_elem).text(hour<10?"0"+hour:hour);//计算小时
                                        $(minute_elem).text(minute<10?"0"+minute:minute);//计算分
                                        $(second_elem).text(second<10?"0"+second:second);// 计算秒
                                    } else { 
                                        clearInterval(timer);
                                    }
                                }, 1000);
                            }

                            </script>


标签: 轮播图倒计时
共有 人打赏支持
粉丝 0
博文 26
码字总数 6107
评论 (3)
jenn吖
3 为神马有问题
开源中国社区-紫薯

引用来自“jenn88”的评论

3 为神马有问题

您好!遇到什么问题了啊!
开源中国社区-紫薯

引用来自“jenn88”的评论

3 为神马有问题
你好!有什么问题啊!
×
开源中国社区-紫薯
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: